javascript学习5 - 爱码网

%运算符的使用
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6         <script type="text/javascript">
 7             window.onload=function(){
 8                 var aLi=document.getElementsByTagName('li');
 9                 var arr=['red','yellow','blue'];
10                 for(var i=0;i<aLi.length;i++){
11                     aLi[i].index=i;
12                     aLi[i].style.background=arr[i%arr.length];
13                     
14                     aLi[i].onmouseover=function(){
15                         this.style.background='#000';
16                     }
17                     aLi[i].onmouseout=function(){
18                         this.style.background=arr[this.index%arr.length];
19                     }
20                 }
21             }
22             /*
23              说明：
24                  0%3=0
25                  1%3=1
26                  2%3=2
27                  3%3=0
28                  4%3=1
29                  5%3=2
30                  6%3=0
31                  7%3=1
32                  8%3=2
33                  9%3=0
34              * */
35         </script>
36     </head>
37     <body>
38         <ul>
39             <li></li>
40             <li></li>
41             <li></li>
42             <li></li>
43             <li></li>
44             <li></li>
45             <li></li>
46             <li></li>
47             <li></li>
48         </ul>
49     </body>
50 </html>
View Code