代码描述:JavaScript奇数行或偶数行。JavaScript奇数行或偶数行源码实例
jQuery实现此功能非常简单,这里不多介绍,参阅jQuery获取li元素列表的偶数或者奇数行代码实例一章节。 下面通过代码实例介绍一下如何利用原生JavaScript实现此功能,代码如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="https://www.51qianduan.com/" /> <title>51前端</title> <style type="text/css"> li{ width:240px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } </style> <script type="text/javascript"> window.onload=function(){ var oLis=document.getElementsByTagName("li"); for(var index=0;index<oLis.length;index++){ if(index%2==0){ oLis[index].style.backgroundColor="green"; } } } </script> </head> <body> <ul> <li>只有努力奋斗才会有美好的明天。</li> <li>分享互助是进步最大的源动力。</li> <li>每一天都是新的,要好好珍惜。</li> <li>没有人一开始就是高手,只有努力才有成长的可能</li> <li>只有当下的时间是可贵的,下一秒都是虚幻的</li> </ul> </body> </html>
请绑定手机号,在继续操作
注意:只有绑定手机以后,才可使用网站全部功能