JS 可以为任何HTML元素添加任意个 自定义属性
例：for( var i=0; i<aBtn.length; i++ ){
aBtn[i].abc = 123;
aBtn[i].xyz = true;
}
放三张图片，当鼠标点击图片的时候就会变颜色，
当鼠标再次点击的时候就会恢复原来的样子
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>无标题文档</title> 6 <style> 7 li { list-style:none; 114px; height:140px; background:url(img/normal.png); float:left; margin-right:20px; } 8 </style> 9 <script> 10 window.onload = function (){ 11 var aLi = document.getElementsByTagName('li'); 12 // var onOff = true; // 只能控制一组！ 13 14 for( var i=0; i<aLi.length; i++ ){ 15 16 aLi[i].onOff = true; 17 18 aLi[i].onclick = function (){ 19 20 // alert( this.style.background ); 21 // 背景不能判断 22 // color red #f00 23 // 相对路径 24 25 if ( this.onOff ) { 26 this.style.background = 'url(img/active.png)'; 27 this.onOff = false; 28 } else { 29 this.style.background = 'url(img/normal.png)'; 30 this.onOff = true; 31 } 32 }; 33 } 34 }; 35 </script> 36 </head> 37 38 <body> 39 40 <ul> 41 <li></li> 42 <li></li> 43 <li></li> 44 </ul> 45 46 </body> 47 </html>