将 CSS 类设置为 href="/"在 JQuery 中

Question

我正在尝试在侧边栏中的链接中设置“选定”CSS 类。当我在“家”时，例如 root url / 我在设置此类时遇到问题。因为所有 URL 都以 / 结尾。

这里有一些相关代码：

$(document).ready(function(){
    var path = location.pathname.substring();
    $('nav#sitenavigation a[href$="' + path + '"]').attr('class', 'selected');
});

如何将“selected”设置为仅包含以下内容的a标签：href =“/”而不是例如href =“/ events /”？

Answer 1

仅使用=（属性等于) 而不是 $= (属性结尾为< /a>)，像这样：

$(document).ready(function(){
  var path = location.pathname.substring();
  $('nav#sitenavigation a[href="' + path + '"]').attr('class', 'selected');
});

Answer 2

$('nav#sitenavigation a[href=/]').attr('class', 'selected');

应该可以了 - 您只选择 href 为“/”的链接。唯一的区别是 = 与 $=。为了完全匹配您的代码...

$('nav#sitenavigation a[href="' + path + '"]').attr('class', 'selected'); 

jQuery 选择器页面解释了所有不同的比较运算符的工作原理：
http://api.jquery.com/category/selectors/

最后一点 - 此代码将删除链接上的任何其他类并将其替换为选定的。要保留任何现有的类，请使用 addClass() ，如下所示：

$('nav#sitenavigation a[href="' + path + '"]').addClass('selected');