1

次のHTMLを検討してください。

<div class="container">
    <div class="item medium type">  value1  </div>
    <div class="item">  value2  </div>
    <div class="item large">  value3  </div>
    <div class="item small">   value4  </div>
    <div class="item">  value5  </div>
    <div class="item">  value6  </div>
    <div class="item">  value7  </div>
    <div class="item medium"> value8  </div>
    <div class="item">  value9  </div>
</div>

container divサブクラスを持たないすべての子を取得する jQuery セレクターを作成する簡単な方法はありますか?

たとえば、セレクター( ) を記述し、値, , ,を持つ$('myselector').each()項目のみを取得する必要があります(これらの s にはサブクラスがないため)。divvalue2value5value6value7value9div

私は明らかなことを見逃しているかもしれません。しかし、私はこれに関するほとんどの情報を得るために簡単な検索を行いました.

4

4 に答える 4

5

このセレクターを使用できます。

$('.container [class=item]')

クラス属性が正確に等しいすべての子を取得しますitem(したがって、他のクラスはありません)。


しかし、実際にはスケーラブルではありません。要素を除外しない別のクラスを追加する必要がある場合はどうすればよいでしょうか?

おそらく、次のような他の要素にクラスを追加することを検討する必要があります。

<div class="container">
    <div class="item sub medium type">  value1  </div>
    <div class="item">  value2  </div>
    <div class="item sub large">  value3  </div>
    <div class="item sub small">   value4  </div>
    <div class="item">  value5  </div>
    <div class="item">  value6  </div>
    <div class="item">  value7  </div>
    <div class="item sub medium"> value8  </div>
    <div class="item">  value9  </div>
</div>

そして:not、セレクターで使用します:

$('.container .item:not(.sub)')
于 2013-03-06T06:36:27.673 に答える
1

試すnot

 $('.container .item').not('.medium , .large,.small,.type')

または属性セレクター

$('.container [class=item]').each(function(){
   //do your stuff
});
于 2013-03-06T06:37:29.387 に答える
1

使用できます$("div[class$='item']")

また、http://api.jquery.com/category/selectors/もご覧ください。

于 2013-03-06T06:37:52.490 に答える
1

次のように属性セレクターを使用する場合:

$('.container [class=item]')

次に、次のような要素のみに一致します。

<div class="item">value1</div>

これではありません(クラス名「item」の周りの空白に注意してください):

<div class=" item  ">value1</div>

class 属性に空白がないと仮定するのは安全ではありません。jQuery DOM 操作の結果として、空白が挿入されたり、取り残されたりする可能性があります。これに対する解決策は、クラス「アイテム」のみを持つすべての要素を選択する前に、クラス属性をトリムすることです。

$('.container')
    .children() // select all the elements contained within .container
    .each(function(){
        // strip whitespace from class attribute
        $(this).attr('class',$.trim($(this).attr('class')));
    });

// fade out all elements within .container that ONLY have the class
// "item" and nothing else
$('.container [class="item"]').fadeOut();
于 2013-03-06T06:47:35.690 に答える