隠された子どものうちのn番目の子

Question

私は、隠されていてもいなくてもよい要素（兄弟）を持っています（ "隠された"クラスがあります）。

インデックスに基づいて要素の1つを選択したいので、：nth-​​child擬似クラスを使用します。

ただし、すべての要素のn番目の子ではなく、と表示されるの子を選択します。だから私のような何か試してみました：

$('.product-cell'):not('is-hidden'):nth-child(2); 

をしかし、それは動作しません、私は私の構文を台無しにするか、このような疑似クラスをスタックすることは不可能である必要がありますか？この問題を解決するにはどうしたらいいですか？

Answer 1

しかし、それは動作しません、私は私の構文を台無しにするかは、次のように疑似クラスをスタックすることは不可能ですか？この問題を解決するにはどうしたらいいですか？

実際には両方とも。

コロン構文を使用している場合は、すべてのセレクタを単一の文字列にする必要があります。複数のメソッド呼び出しを使用する場合は、コロン:ではなく、.の期間を使用します。

さらに、:nth-child()は常にそれが隠されていますかどうかに関係なく、その親のn番目の子だか、このように、:nth-child()の代わりに:eq()を使用する必要があるので、特定のクラス、などを持っている要素をピックアップ：

// :eq() is zero-indexed so :eq(1) selects the second match 
$('.product-cell:not(.is-hidden):eq(1)') 

Answer 2

最初に、notステートメントにクラスセレクタがありません。ただし、jQueryのnot()とnth-child()セレクタは、最初のセレクタの一部として設計されています。

$('.product-cell:not(.is-hidden):nth-child(2)') 

Answer 3

私が正しいと理解していれば、

あなたはない.is-hiddenクラスの最後の子に他ならない.is-hiddenと呼ばれるクラスを持っていないnth childを探しています。

あなたのHTMLは次のようになりますと仮定すると： -

<ul class='product-cell'> 
    <li>Glen</li> 
    <li class='is-hidden'>Tane</li> 
    <li>Ralph</li> 
    <li class='is-hidden'>David</li> 
    <li class='is-hidden'>David111</li> 
    <li>David22</li> 
</ul> 

は最後の子を取得するには、以下のjQueryのです

$('.product-cell li[not(.is-hidden)]:last-child').text() 

結果：

David22