jQuery對多個addClass的簡寫？

我有這段代碼：jQuery對多個addClass的簡寫？

$("body.ow-client1 #stage-nav li.nav1 a").addClass("sub-nav-active"); 
$("body.ow-client2 #stage-nav li.nav2 a").addClass("sub-nav-active"); 
$("body.ow-client3 #stage-nav li.nav3 a").addClass("sub-nav-active"); 
$("body.ow-client4 #stage-nav li.nav4 a").addClass("sub-nav-active"); 
$("body.ow-client5 #stage-nav li.nav5 a").addClass("sub-nav-active"); 
$("body.ow-client6 #stage-nav li.nav6 a").addClass("sub-nav-active"); 
$("body.ow-client7 #stage-nav li.nav7 a").addClass("sub-nav-active"); 
$("body.ow-client8 #stage-nav li.nav8 a").addClass("sub-nav-active"); 
$("body.ow-client9 #stage-nav li.nav9 a").addClass("sub-nav-active");

這一切都很好，但我想知道如果有一個速記寫的？

來源

2012-01-08 Yahreen

你可以發佈你正在嘗試瀏覽的HTML嗎？這些是一些非常具體的選擇器。您可以使用更普遍的選擇器。 – superluminary 2012-01-08 21:53:47

那麼，如果你在Client1的頁面上，那麼這個客戶端的側面導航就會在一個無序的列表中被高亮顯示。 – Yahreen 2012-01-08 21:56:15

你是否有'id =「stage-nav」'的多個元素？或者這些選擇器背後的想法是，只有當身體有一個'.ow-clientX'類時才應用該類。 – nnnnnn 2012-01-08 21:58:16

請嘗試以下

var i; 
for (i = 1; i <= 9; i++) { 
    var sel = 'body.ow-client' + i + ' #stage-nav li.nav' + i + ' a'; 
    $(sel).addClass("sub-nav-active"); 
}

來源

2012-01-08 21:50:49 JaredPar

li.navX也不同:-) – 2012-01-08 21:51:24

@SergioTulentsev謝謝，修正 – JaredPar 2012-01-08 21:52:10

謝謝，如果在未來增加額外的客戶端呢？（數字超出「9」）？ – Yahreen 2012-01-08 21:54:01

我認爲這是您可以做到這一點的唯一方法。

$("body.ow-client9 #stage-nav li a").addClass("sub-nav-active");

來源

2012-01-08 21:50:45

一件事，你可以只選擇的concat在一起：

$("body.ow-client1 #stage-nav li.nav1 a, body.ow-client2 #stage-nav li.nav2 a, body.ow-client3 #stage-nav li.nav3 a").addClass("sub-nav-active");

但是，這是難以閱讀。爲什麼你需要編號爲ow-clientX的課？

來源

2012-01-08 21:51:03

你也可以做到這一點沒有JS代碼，把它在樣式表：

<style> 

body.ow-client1 #stage-nav li.nav1 a, 
body.ow-client2 #stage-nav li.nav2 a, 
body.ow-client3 #stage-nav li.nav3 a, 
/* ... */ 
body.ow-client9 #stage-nav li.nav9 a { 
             /* styles 
              from sub-nav-active 
              here */ 
            } 
</style>

你不會實際上有一個類中調用sub-nav-active了，你使用的只是應用適當的樣式如上所示選擇器。（顯然這個解決方案僅適用於sub-nav-active的唯一要點是將樣式應用於活動節中的錨元素：如果您還將其作爲jQuery選擇器在其他JS代碼中使用，那麼它將不起作用）

來源

2012-01-08 23:04:33 nnnnnn

jQuery對多個addClass的簡寫？

回答

相關問題