动态导航条 当前超链接高亮显示

CSS:

<!
-- .nav
{
    margin: 1px 0;
    width: 100%;
    font-family: verdana;
    height: 21px;
    background-color: #E6F2FF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}
.nav UL
{
    padding: 0px;
    display: block;
    margin: 0px;
    list-style-type: none;
    height: 21px;
    background-color: #E6F2FF; /*970B0B*/
    color: #333333;
}
.nav LI
{
    border-right: #ffffff 1px solid;
    display: block;
    float: left;
    height: 21px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}
.nav LI A
{
    padding: 1px 15px 0;
    display: block;
    font-weight: bold;
    color: #333;
    line-height: 20px;
    text-decoration: none;
}
.nav LI A:hover
{
    color: #562505;
    background-color: #f4f524; /**/
    text-decoration: none;
}
.nav LI A:active
{
    color: #ffffff;
    background: #86F2E4; /*D42524 D425FF */
    text-decoration: underline;
}
.nav LI A:visited
{
    color: #342578;
    text-decoration: none;
}
.current
{
    color: #ffffff;
    background: #86F2E4; /*D42524 D425FF */
}
.nav li#date
{
    color: #ffffff;
    padding: 2px 15px 0;
}
-- >

 

 Javascript:

    window.onload=function menuFix() {
    var strUrl,strHref;
    var Navs=document.getElementById("nav1").getElementsByTagName("a");     //nav1是ul 的id                    
    // 如果链接没有参数，或者URL链接中不存在我们要获取的参数，则返回数组中的序号
    strUrl=location.href.substring(location.href.lastIndexOf("/")+1);//取得URL页面名称
    for (var i = 0; i < Navs.length; i++) {            
        strHref=Navs[i].getAttribute("href").substring(Navs[i].getAttribute("href").lastIndexOf('/')+1);    
        ///在IE6,IE7中strHref获得的是全路径，而在IE8和ff中获得的是页面名称，为了兼容，需要将它的字符串进行拆分/
        if(strUrl==strHref){//高亮当前菜单
            Navs[i].className = "current"        
        }
        else{
            Navs[i].onmouseover=function() {
                this.className+=(this.className.length>0? " ": "") + "over";
            }
            Navs[i].onmouseout=function() {
                this.className=this.className.replace(new RegExp("( ?|^)over\\b"),"");
            }  
        }
    }
}

HTML

 <div>
        <ul id="nav1" class="nav">
            <li style="border: 0"><a href="NavTest2.aspx?id=1">Index</a></li>
            <li><a href="NavTest2.aspx?id=2">Product</a></li>
            <li><a href="NavTest2.aspx?id=3">Service</a></li>
            <li><a href="NavTest2.aspx?id=4">Support</a></li>
            <li><a href="NavTest2.aspx?id=5">About us</a></li>
            <li><a href="NavTest2.aspx?id=6">BBS</a></li>
        </ul>
    </div>