javascript - 如何使用 jquery 将特定类添加到 anchor 标记 href 等于 URL?

标签 javascript jquery html anchor

我想要一个导航到 <a></a> 的 jQuery 动态菜单标记和包含在页面 URL 中的标记。

$('ul.nav.navbar-nav.side-nav.nicescroll-bar li').find('a').each(function() {
  var text = $(this).attr("href");
  if (window.location.href.includes(text)) {
    $('ul.nav.navbar-nav.side-nav.nicescroll-bar li a').addClass('active')
  } else {}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="nav navbar-nav side-nav nicescroll-bar" style="overflow: hidden; width: auto; height: 100%;">
  <li><a href="home">home</a></li>
  <li><a href="dashboard">dashboard</a></li>
  <li><a href="base">base</a></li>
  <li><a href="test">test</a></li>
</ul>

在这段代码中,所有菜单都有颜色变化,应该根据页面的地址改变菜单的颜色。

最佳答案

只需删除else中的类:

if (window.location.href.includes(text)) {
  $(this).addClass('active')
} else {
  $(this).removeClass('active')
}

关于javascript - 如何使用 jquery 将特定类添加到 anchor 标记 href 等于 URL?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53411862/

相关文章:

javascript - 如果我对 contenteditable 项目执行 "jquery sortable",那么我将无法再将鼠标聚焦在 contenteditable 文本内的任何位置

python - 使用 BeautifulSoup 解析文档而不解析 <code> 标签的内容

javascript - 检查 div 的内容以应用特定 ID

javascript - 删除嵌套对象中除js中的一个键之外的所有键

javascript - 尝试对 PHP 进行 ajax POST 调用以将 SQL 查询变量返回给 jquery 时出错

jQuery $(document).ready 不是一个函数 - Rails 3.1

html - flexbox children "positioned"是否可以用来绝对定位他们的 child ?

javascript - Immutable.js或Lazy.js是否执行捷径融合?

javascript - Facebook 页面不会自动调整为较小的内容

javascript - 使用分类 ("active"鼠标悬停时 D3 颜色变化,真)