1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 4 <title>无标题文档</title> 5 <style type="text/css"> 6 .item{width:200px;height:200px;background-color:#60F;float:left;margin:2px;} 7 </style> 8 </head> 9 10 <body> 11 <div class="item" onclick="sel(this)"></div> 12 <div class="item" onclick="sel(this)"></div> 13 <div class="item" onclick="sel(this)"></div> 14 <div class="item" onclick="sel(this)"></div> 15 <div class="item" onclick="sel(this)"></div> 16 <div class="item" onclick="sel(this)"></div> 17 <div class="item" onclick="sel(this)"></div> 18 <div class="item" onclick="sel(this)"></div> 19 <div class="item" onclick="sel(this)"></div> 20 <div class="item" onclick="sel(this)"></div> 21 <div class="item" onclick="sel(this)"></div> 22 <div class="item" onclick="sel(this)"></div> 23 </body> 24 <script type="text/javascript"> 25 function sel(a){ 26 var sy=document.getElementsByClassName("item"); 27 for(var i=0;i<sy.length;i++){ 28 sy[i].style.backgroundColor="blue"; //先让所有元素变为初始颜色 29 } 30 a.style.backgroundColor="red"; //让该元素选中变色 31 } 32 </script> 33 </html>
