使用 JavaScript 将类添加到特定的 href 元素

Question

我正在尝试将一个类添加到菜单导航中当前 URL 的锚点以区分它。我已经研究并使用了这个 sn-p

'http://' + window.location.hostname + window.location.pathname

我能够定位我尝试选择的 URL。但是，我找不到将类添加到锚元素的确切语法。我已经尝试了这个 sn-p 的许多变体

$('[href="http://' + window.location.hostname + window.location.pathname 
+ '"]').addClass("current-menu-item");

没有任何效果。我想知道我是否遗漏了一些明显的东西，或者是否有更优雅的方法来解决这个问题。任何意见是极大的赞赏！谢谢！

Answer 1

你可以这样做：

$(function() {
  $('nav a[href^="/' + location.pathname.split("/")[1] + '"]').addClass('current-menu-item');
});

您当前的选择器过于通用，它会针对您页面中的任何链接。只需更改上面示例中的 nav a 选择器以匹配您的特定 HTML。

来自CSS-Tricks

Answer 2

var href = window.location.href.match(/[A-Za-z\_]+$/);
if(!href || !href[0] )
    return false;
$("[active='"+href+"']").addClass("active");