如何给页面导航栏的选中栏目添加特殊样式，一直没怎么搞清楚，今天学习了一下，并做个总结。 
这边有两种情况，一种是直接给当前页面添加特殊样式，当网页刷新或者跳转到下一页后，样式消失；另一种情况是即时刷新页面后样式仍然有效。 
直接上代码： 
第一种情况：

<script type="text/javascript" src="http://www.mamicode.com/templets/js/jquery.js"></script><script type="text/javascript">$(document).ready(function(){    $(".nav a").each(function(){        $(this).click(function(){            $(".nav .hover").removeClass("hover");            $(this).addClass("hover");	            return false;//防止页面跳转        });    });});</script><div class="nav"><ul>    <li><a href="http://www.mamicode.com/1.html" class="hover"> 首页</a></li>    <li><a href="http://www.mamicode.com/2.html"> 个人资料</a></li>    <li><a href="http://www.mamicode.com/3.html"> 我的好友</a></li>    <li><a href="http://www.mamicode.com/4.html"> 消息管理</a></li> </ul>   </div>

第二种情况：

<script type="text/javascript" src="http://www.mamicode.com/templets/js/jquery.js"></script><script type="text/javascript">$(document).ready(function(){    $(".nav a").each(function(){        $this = $(this);        if($this[0].href=http://www.mamicode.com/=String(window.location)){"hover");        }    });});</script><div class="nav"><ul>    <li><a href="http://www.mamicode.com/1.html"> 首页</a></li>    <li><a href="http://www.mamicode.com/2.html"> 个人资料</a></li>    <li><a href="http://www.mamicode.com/3.html"> 我的好友</a></li>    <li><a href="http://www.mamicode.com/4.html"> 消息管理</a></li> </ul>   </div>

第二种情况也可见案例：http://download.csdn.net/detail/moqiang02/6543801（下载不需积分，希望大家一起交流学习） 

利用Jquery给当前页或者跳转后页面的导航栏添加选中后样式