如何利用JS实现在li中添加或删除class属性
<divclass="head_navclearfix"><ulclass="nav"><li><ahref="#"class="CCC">AAA</a><li><ahr...
<div class="head_nav clearfix">
<ul class="nav">
<li><a href="#" class="CCC">AAA</a>
<li><a href="#" class="BBB">BBB</a></li>
<li><a href="#" class="CCC">CCC</a></li>
</ul>
</div>
代码如上,是想在我首页实现的一个TAB效果,
开始时(首页),会给AAA的li添加class="cur",
如
<div class="head_nav clearfix">
<ul class="nav">
<li class="cur"><a href="#" class="CCC">AAA</a>
<li><a href="#" class="BBB">BBB</a></li>
<li><a href="#" class="CCC">CCC</a></li>
</ul>
</div>
当点击BBB或CCC后,A的class="cur"被删除,然后在BBB或CCC中添加class="cur"
哪位朋友帮忙下,谢谢! 展开
<ul class="nav">
<li><a href="#" class="CCC">AAA</a>
<li><a href="#" class="BBB">BBB</a></li>
<li><a href="#" class="CCC">CCC</a></li>
</ul>
</div>
代码如上,是想在我首页实现的一个TAB效果,
开始时(首页),会给AAA的li添加class="cur",
如
<div class="head_nav clearfix">
<ul class="nav">
<li class="cur"><a href="#" class="CCC">AAA</a>
<li><a href="#" class="BBB">BBB</a></li>
<li><a href="#" class="CCC">CCC</a></li>
</ul>
</div>
当点击BBB或CCC后,A的class="cur"被删除,然后在BBB或CCC中添加class="cur"
哪位朋友帮忙下,谢谢! 展开
2个回答
展开全部
<div class="head_nav clearfix">
<ul class="nav">
<li onclick="setCurrent(0)"><a href="#" class="CCC">AAA</a>
<li onclick="setCurrent(1)"><a href="#" class="BBB">BBB</a></li>
<li onclick="setCurrent(2)"><a href="#" class="CCC">CCC</a></li>
</ul>
</div>
<script type="text/javascript">
function setCurrent(i){
var parentElement = document.getElementById("nav");
for (var j=0;j<parentElement.children.length;j++){
parentElement.children[j].className = (i==j)?:"currentStyleName":"otherStyleName";
}
}
</script>
<ul class="nav">
<li onclick="setCurrent(0)"><a href="#" class="CCC">AAA</a>
<li onclick="setCurrent(1)"><a href="#" class="BBB">BBB</a></li>
<li onclick="setCurrent(2)"><a href="#" class="CCC">CCC</a></li>
</ul>
</div>
<script type="text/javascript">
function setCurrent(i){
var parentElement = document.getElementById("nav");
for (var j=0;j<parentElement.children.length;j++){
parentElement.children[j].className = (i==j)?:"currentStyleName":"otherStyleName";
}
}
</script>
追问
不好意思,开始我写错了,也有点表达错了,代码应该如下:
AAA
BBB
CCC
AAA为index首页链接,
如果我想在打开AAA链接后,当前li已经添加了class="cur",
而当打开BBB后,BBB的li的class要为cur,同理CCC
谢谢!
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询