0

非表示の場合と非表示の場合がある要素(兄弟)がいくつかあります(クラス「is-hidden」が適用されています)。

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

ただし、すべての要素の n 番目の子ではなく、n番目の可視の子を選択したいと考えています。だから私は次のようなものを試しました:

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

しかし、それは機能しません。構文を台無しにしましたか、それともこのような疑似クラスをスタックすることは不可能ですか? この問題を解決するにはどうすればよいですか?

4

3 に答える 3

3

しかし、それは機能しません。構文を台無しにしましたか、それともこのような疑似クラスをスタックすることは不可能ですか? この問題を解決するにはどうすればよいですか?

実際には両方。

コロン構文を使用している場合は、すべてのセレクターを 1 つの文字列に入れる必要があります。複数のメソッド呼び出しを使用する場合.は、コロンの代わりにピリオドを使用し:ます。

さらに、:nth-child()非表示か特定のクラスなどに関係なく、親の n 番目の子である要素を常に選択します。したがって、次のよう:eq()に の代わりに使用する必要があります。:nth-child()

// :eq() is zero-indexed so :eq(1) selects the second match
$('.product-cell:not(.is-hidden):eq(1)')
于 2012-04-12T11:33:40.417 に答える
1

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

$('.product-cell:not(.is-hidden):nth-child(2)')
于 2012-04-12T11:30:20.373 に答える
0

私の理解が正しければ、

not クラスの最後の子にすぎないnth childというクラスを持たない を探しています。.is-hidden.is-hidden

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
于 2012-04-12T11:57:15.340 に答える