javascript5
Posted 左耳_fly
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript5相关的知识，希望对你有一定的参考价值。
- %运算符的使用
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>
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 var str=‘‘; 11 for(var i=0;i<aLi.length;i++){ 12 aLi[i].index=i; 13 aLi[i].style.background=arr[i%arr.length]; 14 15 aLi[i].onmouseover=function(){ 16 str=this.style.background;//移入先存颜色 17 this.style.background=‘#000‘; 18 } 19 aLi[i].onmouseout=function(){ 20 this.style.background=str;//移出赋值颜色 21 } 22 } 23 } 24 /* 25 说明： 26 0%3=0 27 1%3=1 28 2%3=2 29 3%3=0 30 4%3=1 31 5%3=2 32 6%3=0 33 7%3=1 34 8%3=2 35 9%3=0 36 * */ 37 </script> 38 </head> 39 <body> 40 <ul> 41 <li></li> 42 <li></li> 43 <li></li> 44 <li></li> 45 <li></li> 46 <li></li> 47 <li></li> 48 <li></li> 49 <li></li> 50 </ul> 51 </body> 52 </html>
以上是关于javascript5的主要内容，如果未能解决你的问题，请参考以下文章