22

次のHTMLがあるとします。

<div class="foo">
  <ul>
    <li>One</li>
    <li>Two</li>
  </ul>
</div> <!-- not originally here -->
<div class="bar">
  <ul>
    <li>Three</li>
    <li>Four</li>
  </ul>
</div>

クラスを持つ要素の子孫ではないliすべての要素を選択したい。派手なフィルター機能でできるのは知っていますが、セレクターだけでできるのではないかと思います。最初に試しました：foo

$(":not(.foo) li")

残念ながら、にはスタイルのない他の祖先（この場合）liがあるため、これは機能しません。以下はうまくいくようです。ul

$(":not(.foo) :not(.foo) li")

つまり、クラスを持っているか、クラスを持つ独自の祖先を持っている祖先を持たないすべてのli要素を選択します。おそらくこれがセレクターでそれを行うための最良の/唯一の方法ですが、私はセレクターの繰り返しにわくわくしていません。そこにもっと良いアイデアはありますか？foofoo:not

フィドル

4

5 に答える 5

31

あなたはこのようにそれを行うことができます

$("li").not('.foo li')

http://jsfiddle.net/y7s54/

また

$("li:not(.foo li)")

http://jsfiddle.net/QpCYY/

クラスfooの祖先を持たないすべてのliを選択します

于 2012-12-14T15:16:33.403 に答える
4

試してみてくださいli:not(.foo > ul > li); これは、2レベル上の親.fooを持つものを除いたすべてのliを選択します。

于 2012-12-14T15:11:56.263 に答える
2

以下のように、セレクターとともにコンテキストを使用してそれを行うことができます。

$('li', $('div:not(.foo)'))

ライブデモ

$('li', $('div:not(.foo)')).each(function(){
    alert($(this).text());
});​
于 2012-12-14T15:15:04.233 に答える
0

これはどう：

$("li:not(.foo > li)")

これが機能しない場合は、ドキュメントのコメントが非常に役立ちます。

http://api.jquery.com/not-selector/

于 2012-12-14T15:11:42.563 に答える
0

このソリューションは少し見栄えが良いと思いますが、速度の違いに関するAPIコメントについては少し論争があります。

$("li").not(".foo li")

フィドル

于 2012-12-14T15:23:52.860 に答える