1 <!doctype html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 <style>
7 *{margin: 0;padding:0;}
8 li{
9 width: 500px;
10 height: 50px;
11 border:1px solid black;
12 }
13 </style>
14 </head>
15 <body>
16 <ul>
17 <li>111</li>
18 <li>222</li>
19 <li>333</li>
20 <li>444</li>
21 <li>555</li>
22 <li>666</li>
23 <li>777</li>
24 <li>888</li>
25 <li>999</li>
26 <li>000</li>
27 </ul>
28 <script>
29 var lis= document.getElementsByTagName("li");
30 for (var i = 0; i < lis.length; i++) {
31 lis[i].onclick=function() {
32 for (var j = 0; j < lis.length; j++) {
33 lis[j].style.background='#fff';
34 };
35 this.style.background='red';
36 };
37 };
38
39 </script>
40 </body>
41 </html>
