jQuery点击导航栏选中更换样式的实现代码

废话不多说了，直接给大家贴代码了，具体代码如下所示：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML L1/DTD/XHTML L1-过渡。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' head title new document/title meta http-equiv=' Content-Type ' Content=' text/html；charset=UTF-8' /车身样式* {边际：0划水：0;border:0pxlist样式： nonemargin :0 auto } * a { text-decoration : none；颜色： # FFF；} ul { width:800px高度：30 px背景-颜色： # C33} ul li { float:left宽度宽度：160像素高度：30 px线高：30 px文本对齐：居中；color: # FFFFFF}ul阿利{ color: # FFFFFF显示：块；宽度宽度：160像素高度：30 px文本装饰：无；}.第一{背景色-颜色： # 0000 ff} ul阿利：悬停{ color : # FFF；显示：块；宽度宽度：160像素高度：30 px文本修饰：下划线；背景-颜色： # 03F}/style脚本类型=' text/JavaScript ' src=' http : jquery-1。7 .1 .量滴js/script脚本语言=' JavaScript '类型=' text/JavaScript ' $(文档)。ready(function (){ $('li ')).每个（函数（索引){ $(这个)).单击(函数(){ $('li ')).移除CLaSS(“第一个”)；$('li ').eq(指数)。addCLaSS(' first ')；});});});/script/head body ul Li class=' first ' a href=' # '首页/a/li lia href='# '列表/a/li lia href='# '内容/a/li lia href='# '联系/a/li lia href='# '关于/a/Li/ul/body/html/body/html(9500 . 163.com)

以上所述是小编给大家介绍的jQuery点击导航栏选中更换样式的实现代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！