jQuery：notと：nth-​​childセレクターを組み合わせる

Question

$j('.select-all-these:not(.except-these):nth-child(3n)'); 

私は特定のクラスを持たないすべての3番目の項目を選択しようとしています。これは私のjQueryセレクタですが、動作しません - ：nth-​​childセレクタは：notセレクタを無視しているようです。私はそれを間違っているのですか？

例として、これは、それがどのように動作するかを示します。

.select-all-these.except-these 
.select-all-these.except-these 
.select-all-these.except-these 
.select-all-these 
.select-all-these.except-these 
.select-all-these 
.select-all-these <-- THIS ONE IS SELECTED 
.select-all-these.except-these 

ありがとう！ :)

Answer 1

$('.select').filter(
    function(){ 
     return !$(this).hasClass('dontselect'); 
    }).filter(
     function(i){ 
      return (i+1)%3 == 0; // unless you want a zero-based count, regular CSS is one-based 
     }).css('color','red'); 

JS Fiddle demo：

私はこの仕事をするために見ることができる唯一の方法は、2つのfilter()呼び出しを使用することでした。

あなたは、しかし、外部変数で、単一filter()コールを使用することができます。

var count = 0; 
$('.select').filter(
    function(){ 
     console.log(!$(this).hasClass('dontselect')); 
     if (!$(this).hasClass('dontselect')){ 
      count++; 
      return count%3 == 0; 
     } 
    }).css('color','red'); 

JS Fiddle demoを。

JSパフォーマンス・はsingle filter is, unsurprisingly, a little fasterことを報告するが、唯一の非常に、非常に、非常にわずか。

参考文献：

• filter()。
• hasClass()。

Answer 2

この方法を使用して結果をフィルタリングする方法はありますか？ここで

$('.select-all-these:nth-child(3n)').not('.except-these'); 

を実証するためのフィドルです：http://jsfiddle.net/ntNgC/

Answer 3

UPDATE： 私は、これはn番目の子かのjQueryの別のセレクタでは可能ではないと思います。ので、より多くの詳細なソリューションを使用することを検討してください：

var count = 0; 
$('.select-all-these').each(function() { 
    if(!$(this).hasClass('except-these')) { 
     count++; 
    } 
    if(count === 3) { 
     $(this).text('every 3rd element'); 
     count = 0 
    } 
});​ 

http://jsfiddle.net/TJdFS/2/（代替バージョン：http://jsfiddle.net/TJdFS/）

：ない：n番目の子のような任意の追加のフィルタを無視して、一致するすべての要素をカウントします。

参照のjQueryのDOC：

2つは劇的に異なるマッチした要素をもたらすことができるにもかかわらず、当量（N）：n番目の子（N）擬似クラスはで容易に混乱しています。 ：nth-​​child（n）を使用すると、すべての子がカウントされます。指定された要素は、疑似クラスに関連付けられたセレクタと一致する場合にのみ選択されます。 ：eq（n）他の要素の子に限定されず、擬似クラスに付けられたセレクタのみがカウントされ、（n + 1）番目（nは0ベース）が選択されます。

例：

<div class="select-all-these">1</div> 
<div class="select-all-these except-these">2</div> 
<div class="select-all-these except-these">3</div> 
<div class="select-all-these">4</div> 
<div class="select-all-these except-these">5</div> 
<div class="select-all-these">6</div> 

JS：

$('.select-all-these:not(.except-these):nth-child(6)').text('nth-child counts all elements (1 based!)'); 
$('.select-all-these:not(.except-these):eq(1)').text('eq counts only matching elements (0 based!)'); 

結果：

1 
2 
3 
eq counts only matching elements. (0 based!) 
5 
nth-child counts all elements (1 based!) 

http://jsfiddle.net/nFtkE/2/

Answer 4

Nth-childは、フィルタ処理されたグループの選択を扱う場合、直観に反することがあります。

使用.each（）その制限を回避するために：

var count = 0; 
$('.select-all-these:not(.except-these)').each(function(){ 
    if (count++ % 2 == 0) $(this).css('color','red') 
}) 

Answer 5

ベスト簡単な方法=）

$('table tr:not(.class)').eq(1); 

幸運を=）