如何用空格選擇類名和使用通配符

Question

在下面的HTML片段我想創建一個jQuery表達式來選擇具有類zz1_TopNavigationMenu_1 Napa1-topnav zz1_TopNavigationMenu_ *」

我感到困惑的建設全部標籤包含在類名字空間的選擇語法。我也想在這上面通過在末尾的「*」字符描繪的結束外卡。

<table class="Napa1-topnav zz1_TopNavigationMenu_4" border="0" cellSpacing="0" cellPadding="0"> 
<tbody> 
<tr> 
<td style="white-space: nowrap;"> 
<a class="zz1_TopNavigationMenu_1 Napa1-topnav zz1_TopNavigationMenu_3" style="border-bottom-style: none; border-right-style: none; border-top-style: none; font-size: 1em; border-left-style: none;" href="/sites/Brand1/SubSite 

Answer 1

如果這些是唯一的3個類，並且您確定它們將按照該順序出現，那麼可以使用attribute-starts-with選擇器。

試試這個：

$('a[class^=zz1_TopNavigationMenu_1 Napa1-topnav zz1_TopNavigationMenu_]') 

這將選擇<a>元素，其中的class屬性與zz1_TopNavigationMenu_1 Napa1-topnav zz1_TopNavigationMenu_開始。

• http://api.jquery.com/attribute-starts-with-selector/

或者，你可以得到元素與前兩類，並使用過濾器，以確保它與第三類結束。它被寫入的方式，它假定你的「通配符」字符將是一個數字或數字。

$('a.zz1_TopNavigationMenu_1.Napa1-topnav').filter(function() { 
    return /zz1_TopNavigationMenu_\d+$/.test($(this).attr('class')); 
}); 

• http://api.jquery.com/filter/

Answer 2

的空格字符不是有效的一類名稱;它是一個分隔符，一個標籤可以包含多個類名，例如，<a id="foobar" class="foo bar">有兩個類：foo和bar，因此$('#foobar').getClasses()將有兩個類名。

所以，如果你想選擇一個單一類元素，你這樣做：

$('.foo') 

如果您想選擇多類元素，你這樣做：

$('.foo.bar') 

Answer 3

.zz1_TopNavigationMenu_1.Napa1-topnav.zz1_TopNavigationMenu_whatever

會讓你擁有所有這三個類的元素。通配符不起作用 - 沒有使用CSS選擇器的設施。我會添加一類類似於：zz1_TopNavigationMenu，然後任何也是zz1_TopNavigationMenu_whatever將得到thi分組類。或者如果可能的話，你可以使用ID或元素來獲取它們。例如，如果其菜單ID期望它們全部爲li元素，那麼您可以使用：.zz1_TopNavigationMenu_1.Napa1-topnav li或類似的東西。

看看docs on css selectors與jQuery一起使用。