描述:点击哪个,哪个就变蓝色,其余的都是粉色

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>Document</title> 7 <style> 8 *{ 9 margin: 0; 10 padding: 0; 11 } 12 .box{ 13 width: 200px; 14 height: 50px; 15 background-color: pink; 16 margin-bottom: 10px; 17 } 18 </style> 19 </head> 20 <body> 21 <div class="box"></div> 22 <div class="box"></div> 23 <div class="box"></div> 24 <div class="box"></div> 25 <div class="box"></div> 26 27 <script> 28 var boxlist=document.querySelectorAll('.box'); 29 for(var i=0;i<boxlist.length;i++){ 30 boxlist[i].onclick=function(){ 31 for(var j=0;j<boxlist.length;j++){ 32 boxlist[j].style.backgroundColor='pink'; 33 } 34 this.style.backgroundColor='blue'; 35 } 36 } 37 </script> 38 </body> 39 </html>
浙公网安备 33010602011771号