用jQuery实现菜单导航根据链接地址…

用jQuery实现菜单导航自动高亮

闲言少叙，直接上代码：

HTML代码：

<ul id="nav">

<li><a href="/home/">首页</a></li>

<li><a href="/about/">关于我们</a></li>

<li><a href="/news/">最新动态</a></li>

<li><a href="/contact/">联系方式</a></li>

</ul>

jQuery代码：

$(function(){ //等待DOM加载完毕

    var url = document.URL;//取得当前页的URL    

    if(/about/.test(url.toLowerCase()))   //查找在url地址中是否有当前页

    {

          $("#nav a[href='/about/']").parent("li").addClass("current");   //关于我们

    }else if(/news/.test(url.toLowerCase())) 

    {

          $(" #nav a[href='/news/']").parent("li").addClass("current");   //最新动态

      }else if(/contact/.test(url.toLowerCase())) 

    {

          $("#nav a[href='/contact/']").parent("li").addClass("current"); //联系我们

    }else

    {

          $("#nav a[href='/home/']").parent("li").addClass("current");   //默认首页

    }

});