0

:nth-​​childセレクターを使用して特定の要素を選択しています

ケース1:

<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>

ケース2:

<div class='item show'>
<div class='item'>
<div class='item'>
<div class='item show'>
<div class='item'>
<div class='item'>
<div class='item show'>
<div class='item show'>

私のコードはケース1で始​​まり、$('#outerDiv .show:nth-​​child(3n-2)')を実行して3つおきの要素を選択します。これは完全に機能します。次に、ユーザーがいくつかの設定を変更すると、一部の要素が表示クラスを失い、画面が消え、コードはケース2のようになります。問題は、$('#outerDiv .show:nth-​​child(3n --2)')セレクター、コンソールでケース2であることがはっきりとわかりますが、それでもケース1として扱われます。何か間違ったことをしていますか。申し訳ありませんが、実際のコードを投稿できないため、簡単な例を示します。

ありがとう

4

3 に答える 3

1

nth-childセレクターは、クラスに関係なくすべての要素を取得します。

を使用$.eachして、ループ内のクラスを割り当てます

​$('#outerDiv .show').each(function(i){
    if( i%3 === 0){
       $(this).addClass('a'); 
    }        
});​

フィドルをチェック

于 2012-11-30T21:20:50.347 に答える
0

div要素を閉じることから始めます。

それ以外の

<div class='item show'>

置く

<div class='item show'></div>

DOMの3つおき(および最初)の要素を選択する簡単なデモを次に示します。http: //jsfiddle.net/robertp/hVBAC/2/

私はそれがいくらか役立つことを願っています:)

于 2012-11-30T21:28:05.903 に答える
0

filterおよびcss関数を使用します。

 $('#outerDiv .show').filter(function(){
    return $(this).css('display') !== 'none';
 }).filter(":nth-child(3n - 2)");

まず、要素のリストをプロパティのない要素にフィルタリングしますdisplay:none。次に、n番目の子をフィルタリングします。

于 2012-11-30T21:28:14.783 に答える