html
<div class="header-bottom">
<!-- 无下拉导航 -->
<div class="container">
<div class="row">
<div class="col-sm-12">
<ul class="nav nav-pills nav-justified">
<li class=""><a href="index.html">首页</a></li>
<li><a href="html/php.html">PHP</a></li>
<li><a href="#">Div/Css</a></li>
<li><a href="#">JS</a></li>
<li><a href="#">Out Side</a></li>
</ul>
</div>
</div>
</div>
</div>
js
//遍历a标签获取href与当前网页url比较并添加class
$('.header-bottom .nav li a').each(function(){
$this = $(this);
if($this[0].href==String(window.location)){
$this.parents('li').addClass('active');
}
});
本文介绍了一种使用JavaScript实现网页导航栏中当前页面链接高亮显示的方法。通过遍历导航栏中的所有a标签,并将当前页面URL与每个a标签的href属性进行对比,为当前页面的链接添加'active'类,从而实现视觉上的突出效果。
1408

被折叠的 条评论
为什么被折叠?



