添加自定义属性值:
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>无标题文档</title> 6 <script> 7 window.onload = function (){ 8 var aBtn = document.getElementsByTagName('input'); 9 10 for( var i=0; i<aBtn.length; i++ ){11 12 aBtn[i].index = i; // 自定义属性(索引值)13 //aBtn[0].index = 0; // for第一遍循环时:i=0; 相当于给第一个input自定义一个属性 index=0;14 //aBtn[1].index = 1; // for第二遍循环时:i=1; 相当于给第二个input自定义一个属性 index=1;15 //aBtn[2].index = 2; // for第三遍循环时:i=2; 相当于给第三个input自定义一个属性 index=2;16 17 //此时,i已经循环了3遍 i=3;18 aBtn[i].onclick = function (){19 20 // alert( i ); // 321 alert( this.index );22 23 };24 }25 };26 </script>27 </head>28 29 <body>30 31 <input index=0 type="button" value="btn1" />32 <input index=1 type="button" value="btn2" />33 <input index=2 type="button" value="btn3" />34 35 </body>36 </html>
添加自定义属性值实例讲解:
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>无标题文档</title> 6 <script> 7 window.onload = function (){ 8 var aBtn = document.getElementsByTagName('input'); 9 var aP = document.getElementsByTagName('p');10 11 // 想建立“匹配”“对应”关系,就用索引值12 var arr = [ 'HTML', 'javaSCRIPT', 'CSS' ];13 14 for( var i=0; i<aBtn.length; i++ ){15 16 aBtn[i].index = i; // 自定义属性(索引值)17 18 aBtn[i].onclick = function (){19 // alert( arr[ this.index ] );20 this.value = arr[ this.index ];21 22 aP[ this.index ].innerHTML = arr[ this.index ];23 };24 }25 };26 </script>27 </head>28 29 <body>30 31 <input type="button" value="btn1" />32 <input type="button" value="btn2" />33 <input type="button" value="btn3" />34 <p>a</p>35 <p>b</p>36 <p>c</p>37 38 </body>39 </html>
新闻热点
疑难解答