您现在的位置是:首页 > 前端 > JavaScript网站首页JavaScript

js实现当前导航菜单高亮显示

简介1.此方法适用于没有下拉菜单(没有三级栏目) <script type="text/javascript"> var nav = document.getElementById("navMenu"); var lin

1.此方法适用于没有下拉菜单(没有三级栏目)

var nav = document.getElementById("navMenu");
var links = nav.getElementsByTagName("li");
var lilen = nav.getElementsByTagName("a");
var currenturl = document.location.href;
var last = 0;
for (var i=0;i
    var linkurl =  lilen[i].getAttribute("href");
    if(currenturl.indexOf(linkurl)!=-1){
        last = i;
    }
}
links[last].className = "home";


2.笨方法

//判断当前URL给导航添加class
var qgurl=window.location.href;//获取当前URL
strs=qgurl.split("/"); //字符串分割
if(strs[4]=='chanpinzhongxin'){
    $(".home").eq(1).addClass("current");
}else if(strs[4]=='chenggonganli'){
    $(".home").eq(2).addClass("current");
}else if(strs[4]=='xinwenzixun'){
    $(".home").eq(4).addClass("current");
}else if(strs[4]=='guanyuwomen'){
    $(".home").eq(5).addClass("current");
}else if(strs[4]=='lianxiwomen'){
    $(".home").eq(7).addClass("current");
}else if(strs[4]==null || strs[4]==''){
    $(".home").eq(0).addClass("current");
}


下一篇:js常用代码

文章评论

Top