添加類於母公司具有特定類的第n個孩子，用jQuery

這是最好用小提琴解釋說：http://jsfiddle.net/hxsJx/添加類於母公司具有特定類的第n個孩子，用jQuery

我想添加一個類元素的第n個孩子，但只有當這些孩子們有特定的課程。所以在我的例子中，只有文章E和J應該得到'結束'類。

nth-child選擇器似乎忽略了類選擇器，這可能是有意的行爲，但我無法找到解決方法。

感謝任何指針夥計...

來源

2012-02-22 Dan

選擇器按預期工作。請記住，CSS :nth-child選擇器是基於一個（它從一開始計數）。

4n th元素是D和H，其確實具有類別1。

您的選擇：.articles article.1:nth-child(4n)

HTML：

<section class="articles">   .articles 
<article class="1 4">A</article>  :nth-child(1) 
<article class="1 4">B</article>  :nth-child(2) 
<article class="2 2">C</article>  :nth-child(3) 
<article class="1">D</article>   :nth-child(4) and :nth-child(4n) and .1 
<article class="1">E</article>   :nth-child(5) 
<article class="3 2">F</article>  :nth-child(6) 
<article class="1 4">G</article>  :nth-child(7) 
<article class="1 2">H</article>  :nth-child(8) and :nth-child(4n) and .1 
<article class="1 3 4">I</article>  :nth-child(9) 
<article class="1 2 4">J</article>  :nth-child(10) 
</section>

來源

2012-02-22 13:31:00

不，我不這麼認爲。比較：http://jsfiddle.net/s2LrG/。第n個子選擇器被忽略。 – Dan 2012-02-22 13:33:39

@Dan如何忽略'：nth-child'選擇器？元素D和H是關於其父母的第4n（4和8）個子元素，並且它們都具有類「1」。你是否把'：n-child（4n）'與'：n-child（4n-1）'混淆了：http://jsfiddle.net/s2LrG/1/？ – 2012-02-22 13:36:39

也許這個問題存在混淆......我試圖用這個例子來做的只是給一班'1'的第n個孩子'結束'一類。所以只有文章A，B，D，E，G，H，I和J有'1'的類，所以我想把這個類應用到這個選擇的每個第四項。 E和J（類別爲「1」的第4和第8項）應該是以「結束」類結束的項目。 – Dan 2012-02-22 13:38:21

嘗試Lettering.js http://letteringjs.com/

來源

2012-02-22 13:35:52 Connor

這個問題的相關性是什麼？ – 2012-02-22 13:36:59

這是一個jQuery插件來設計個性角色。 – Connor 2012-02-22 13:38:33

沒有，羅布W是正確的。

//$('.articles article').removeClass('end'); 
$('.articles article.1:nth-child(4n)').addClass('end');

使d和H目標，但如果你將其設置爲

//$('.articles article').removeClass('end'); 
$('.articles article.1:nth-child(5n)').addClass('end');

Ë和J成爲衆矢之的。

編輯：第4個孩子是d和H d等於4和H等於8

1 = A 
2 = B 
3 = C 
4 = D

等，你得到你的號碼混淆。 E和J分別是第5和第10個孩子。

來源

2012-02-22 13:41:21

是的，我可以看到，這可能是應該的（我沒有在jQuery中發現一個巨大的bug）），但我努力想要實現我實際想要做的事情。我基本上想要分兩部分來做：首先，獲得所有具有'1'類的文章。然後對該特定選擇的每個第4項應用一個「結束」類。它現在正在做的是如果它有一個'1'級，那麼接受第n個孩子並添加這個班級。我想要做的只是拿一類'1'的文章，然後對這個選擇的每第n項應用一類'結束'。 – Dan 2012-02-22 13:45:36

數字是正確的 - 完全可以。問題是，在我的例子中，'C'沒有'1'類，所以它不應該（至少我不希望它）計入第n個子選擇。我只想在最初的選擇中包含具有'1'類的文章，然後對這些文章進行n次篩選。 – Dan 2012-02-22 13:52:47

添加類於母公司具有特定類的第n個孩子，用jQuery

回答

相關問題