首页 > 引入同一个头部文件,导航点击当前项,怎么能保证只有当前项保持高亮?

引入同一个头部文件,导航点击当前项,怎么能保证只有当前项保持高亮?

首页和其他页面均引入了同一个头部文件,点击导航的任一项后,该项颜色发生改变,其他不变,,,用js写当前添加类,兄弟移除类,没用,页面发生了跳转,刷新。求指教,如何解决


如果使用不同的文件名包含同一个头文件,可以判断当前的文件名,去设置一个高亮的class


跳转之后再添加class不可以吗


在那个包含头部文件的那也页面里,写js。完成每个页面加载完后,用js给当前页面对应的导航项添加class


对应 页面静态设置高亮,或者做成单页应用


页面在跳转之后发生了变化,说明,你不是单页,这个公共头在其他页面,又是一个单独引用的。建议写死。就是当前页面,当前栏目,样式写死。


根据url去判断属于哪个选项卡,然后再去给相应的选项卡设置样式


多页面跳转的话,在每个页面给对应导航栏设置高亮,另外每个页面加上效果鼠标悬浮在导航栏高亮。这样可否。


var path_array = location.pathname.plit('/');
var result = path_array[path_array - 1];
然后遍历你的导航里面的a的,比对a的href是否等于result, 如果两者相等就给它添加class,否则删除class。(当然如果url没那么简单的话,那就要用正则去找到你想要的当前文件名)

【热门文章】
【热门文章】