如何通过js在li的奇偶或单双标签中增加class?

如下所示,请教大神,如何使用js实现<ul><liclass=“ji”></li><liclass=“ou”></li><liclass=“ji”></li><licla... 如下所示,请教大神,如何使用js实现
<ul>
<li class=“ji”></li>
<li class=“ou”></li>
<li class=“ji”></li>
<li class=“ou”></li>
</ul>
展开
 我来答
超凡且憨厚灬饼子A
2018-04-19 · TA获得超过9400个赞
知道大有可为答主
回答量:5551
采纳率:44%
帮助的人:2397万
展开全部
如果只是个视觉修饰而不是逻辑功能的话,能用css实现的效果就不要用js去做,css3的选择器:
nth-of-type()可以判断奇偶,虽然有可能低版本IE不支持,但是视觉效果的话低版本放弃就完了。
<style>
ul li:nth-of-type(odd){奇数行样式}   
ul li:nth-of-type(even){偶数行样式}
<style>  

如果我说服不了你,一定要js的话,那么继续:
 
<script id="jquery_182" type="text/javascript" class="library"
 src="/js/sandbox/jquery/jquery-1.8.2.min.js"></script>

<meta charset="utf-8" />

<ul id="list">
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
</ul>


<script>
function CheckLI() {
    var obj = document.getElementById("list").getElementsByTagName("li");//取得#list下所有li
    for(var i=0;i<obj.length;i++){//循环出每个li
        //下面两句中添加class用的jquery的addClass()方法,需要载入JQ才支持,js原生的方法需要IE10才支持,兼容的方法要另外写函数,手打的,直接最简单的JQ实现
    if(i % 2 == 0) {$(obj[i]).addClass("ou");}//如果被2整除是偶数
        else {$(obj[i]).addClass("ji");}//否则是奇数
    }
}


window.onload = CheckLI;//网页载入后执行以上函数
</script>

<style>
    .ji{color: red;}
    .ou{color: yellow;}
</style>
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式