利用jquery改变指定元素的class样式

Question

<div id="daohang" class="daohang">
<ul>
<li><a href="index.htm" class="shouye">首页</a></li>
<li><a href="/index.htm?actionType=companyIntro">关于博雅</a></li>
<li><a href="/newslist.htm">新闻资讯</a></li>
<li><a href="/chanpin.jsp">产品中心</a></li>
<li><a href="/poslist.htm">经典案例</a></li>
<li><a href="/jiaMenglist.htm">诚邀加盟</a></li>
<li><a href="/index.htm?actionType=lianxi">联系我们</a></li>
</ul>
</div>
我想可以控制点击首页后，首页就有class="shouye"的样式，其它就没有样式了，然后点击关于博雅，这个就有class="shouye"的样式，其它的都没有样式了，就这样的。

Answer 1

jQuery中一般有3个关于改变元素class的函数

addClass、removeClass、toggleClass

addClass
描述: ä¸ºæ¯ä¸ªåŒ¹é…çš„元素添加指定的样式类名
$('div').addClass('className');//为所有div添加名为className的class

removeClass
描述: ç§»é™¤é›†åˆä¸­æ¯ä¸ªåŒ¹é…å…ƒç´ ä¸Šä¸€ä¸ªï¼Œå¤šä¸ªæˆ–全部样式。
$('div').removeClass('className');//将所有div上名为className的class移除

toggleClass
描述: åœ¨åŒ¹é…çš„元素集合中的每个元素上添加或删除一个或多个样式类,取决于这个样式类是否存在或值切换属性。即：如果存在（不存在）就删除（添加）一个类。
$('div').toggleClass('className');//如果div上有这个class就删除，没有就添加

Answer 2

你好！！

问题1：你的超链接是否可以跳转，也就是说点击首页后，是否直接跳到index.htm中？

          如果是这样的话，可能你需要传递一个当前点击项的索引值，然后通过这个索引值，

          在跳转的页面中进行 class="shouye" 的设置；

问题2：如果只是点击项，不发生页面的跳转的话，实现起来相对比较容易；

比如：

$(function(){
    $("#daohang li").click(function(){
        $(this).find("a").addClass("shouye").end().siblings().find("a").removeClass("shouye");
    });
});

 

至于问题1：

其实对于同一个名字的动态页面，前面提到的方式比较方便，可这里是一个链接对应了一个页面，所以可以在不同的页面进行设置就OK了。
之前应该是把问题复杂化了····

Answer 3

$("#daohang > a").click(){
        $("#daohang > a").attr("class","");
        $(this).attr("class","shouye");
}

 <!--
    望采纳谢谢!
    意思是给点击的超链接添加样式,
    方法是先移除之前的样式,然后重新给点击的超链接添加样式.
-->