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

Question

我正在尝试将一个类添加到菜单导航中当前URL的锚点，以便区分它。我做过研究并使用这个片段

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

我能够定位我想要选择的网址。但是，我找不到确定将类添加到anchor元素的确切语法。我尝试了这个代码段的许多变体

$('[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");