不同的页面对应不同的导航栏被选中

最新推荐文章于 2023-02-04 17:24:30 发布

moiki007

最新推荐文章于 2023-02-04 17:24:30 发布

阅读量238

点赞数

文章标签： javascript 前端 html jquery ajax

本文链接：https://blog.csdn.net/m0_49214600/article/details/123924003

版权

js代码

  checkNavigation ( 'common/NavData.html')
/* 页面对应的导航栏选中 */
function  checkNavigation ( navPath){
    $.ajax({
        url: navPath,
        success: function(data) {
            navDataA=$(data).find('a');  //获取相应导航栏html里面的a标签
            for(var i=0;i<navDataA.length;i++) {

                //获取每一个a标签的herf属性
                var links = navDataA[i].getAttribute("href");

                //获取当前窗口的url
                var currentURL = document.location.href;

                //查看div下的链接是否包含当前窗口，如果存在，则给其添加样式
                if (currentURL.indexOf(links) != -1) {
                    var head = document.getElementsByTagName("a")[i];
                    head.style.cssText = "background-color:rgba(49, 136, 623, .8);cursor:pointer;";
                }
            }
        }
    });
}