在JQuery中將CSS類設置為href =“ /”

Question

我試圖在側邊欄的鏈接中將CSS類設置為“ selected”。 當我在“家”時，例如root url /我在設置此類時遇到麻煩。 由於所有URL均以/結尾。

這里有一些相關代碼：

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

如何將“ selected”設置為僅包含以下內容的a-tag：href =“ /”而不是例如href =“ / events /”？

Answer 1

僅使用= （ 屬性等於 ）而不是$= （ 屬性結尾為 ），如下所示：

$(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為“ /”的鏈接。 唯一的區別是= vs $ =。 為了完全匹配您的代碼...

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

jQuery選擇器頁面說明了所有不同的比較運算符如何工作： http : //api.jquery.com/category/selectors/

最后說明-此代碼將刪除鏈接上的所有其他類，並將其替換為selected。 要保留任何現有的類，請使用addClass（），如下所示：

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