prototype入门自定义创建元素

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
 5     <title>prototype</title>
 6 
 7     <script type="text/javascript">
 8 
 9         window.onload = function (){
10             /*
11             var addNum = function (n1,n2){
12                 this.num1 = n1;
13                 this.num2 = n2;
14                 this.add();
15             }
16 
17             addNum.prototype = {
18                 add:function(){
19 
20                     //return    this.num1 + this.num2;
21                     alert(this.num1 + this.num2);
22                 }
23             }
24 
25             var n = new addNum(3,4);
26             //alert(n.add());
27             */
28 
29             var createItems = function (){
30                 this.oBtn = document.getElementById("btn");
31                 this.oName = document.getElementById("tagName");
32                 this.oValue = document.getElementById("tagValue");
33                 this.tag = this.oName.value;
34                 this.val = this.oValue.value;
35                 var _this = this;
36                 this.oBtn.onclick = function (){
37                     //console.log(this.tag + " , " + this.val + " , " + this);
38                     _this.create(_this);
39                 }
40             }
41             createItems.prototype = {
42                 create:function(_this){
43                     alert(this.tag);
44                     _this.nTag = document.createElement(_this.tag);
45                     _this.nTag.innerHTML = _this.val;
46                     document.body.appendChild(_this.nTag);
47                 }                
48             }
49             var c = new createItems();
50         }
51     </script>
52 
53 </head>
54 <body>
55     <input type="text" name="tagName" id="tagName" style="50px;" value="" />
56     <input type="text" name="tagValue" id="tagValue" value="" />
57     <input type="button" value="点击" name="btn" id="btn" />
58 
59 </body>
60 </html>

错的

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
 5     <title>prototype</title>
 6 
 7     <script type="text/javascript">
 8 
 9         window.onload = function (){
10             /*
11             var addNum = function (n1,n2){
12                 this.num1 = n1;
13                 this.num2 = n2;
14                 this.add();
15             }
16 
17             addNum.prototype = {
18                 add:function(){
19 
20                     //return    this.num1 + this.num2;
21                     alert(this.num1 + this.num2);
22                 }
23             }
24 
25             var n = new addNum(3,4);
26             //alert(n.add());
27             */
28 
29             var createItems = function (){
30                 this.oBtn = document.getElementById("btn");
31                 this.oName = document.getElementById("tagName");
32                 this.oValue = document.getElementById("tagValue");
33                 var _this = this;
34                 this.oBtn.onclick = function (){
35                     _this.create();
36                 }
37             }
38             createItems.prototype = {
39                 create:function(){                                    
40                     this.tag = this.oName.value;
41                     this.val = this.oValue.value;
42                     this.nTag = document.createElement(this.tag);
43                     this.nTag.innerHTML = this.val;
44                     document.body.appendChild(this.nTag);
45                 }                
46             }
47             var c = new createItems();
48         }
49     </script>
50 
51 </head>
52 <body>
53     <input type="text" name="tagName" id="tagName" style="50px;" value="" />
54     <input type="text" name="tagValue" id="tagValue" value="" />
55     <input type="button" value="点击" name="btn" id="btn" />
56 
57 </body>
58 </html>

对的