web-dev-qa-db-ja.com

特定のセレクタに一致する親を持つアイテムを除外するJQueryセレクタは何ですか?

私が持っています

var $set = $('.foo,.bar').filter(
    function() {return $(this).parents('.baz').length < 1;});

クラスがfooまたはbarであり、クラスがbazである要素から派生しないすべての要素を選択する方法として。フィルタリングラムダを必要とせずに同じことを達成するセレクターはありますか?

<div class='foo'/><!--match this-->
<div class='bar'/><!--match this-->
<div class='baz'>
    <div class='foo'/> <!--don't match this-->
</div>
70

問題の真実は、jQueryには、必要なことを実行するための特にエレガントな方法がないということです。カオスの答えは機能しますが、複雑なセレクター(複雑なWebページでセレクターと同じくらい遅い)が、より冗長ではあるが高速なフィルター機能よりも価値があるかどうか疑問に思う必要があります。これはそれほど大きな問題ではありません。私はそれを避けることができても、特に長く複雑なセレクターに個人的に疲れています。

JQueryは素晴らしいため、独自のセレクターを作成することもできます。

jQuery.expr[':'].parents = function(a,i,m){
    return jQuery(a).parents(m[3]).length < 1;
};

$('.foo,.bar').filter(':parents(.baz)');

exprマップは、Sizzleセレクターエンジンの一部であり、ドキュメントは次の場所にあります。 Sizzle Custom Pseudo-Selectors

79
$('.foo:not(.baz .foo),.bar:not(.baz .bar)')
30
chaos

私はこれを機能させることができませんでした:

$(".children:not(#parent .children)");

しかし、私はこれを機能させることができます:

$(".children").not($("#parent .children"));

注:これが1.2.6を使用しているjQueryバージョンと関係があるかどうかはわかりません

18
going

これを試してください:

$('div').filter(function () {
  return ($(this).parent().not('.baz'));
})
4

セレクターchaosが機能するはずです:

$('.foo:not(.baz .foo),.bar:not(.baz .bar)')

FireBug と呼ばれる FireFinder の拡張に関するヒントを提供したかっただけで、css/jqueryセレクターをテストするために使用できます。

Webサイトから:Firefinderは(Firefoxの)Firebugの拡張機能であり、選択したCSSセレクターまたはXPath式に一致するHTML要素をすばやく見つける機能を提供します。コンテンツを同時に表示しながら、ページ内のCSSセレクターを即座にテストでき、一致する要素が強調表示されます。

1
BengtBe

var $li = jQuery('li', this).not('.dropdown-menu > li');

Rootsテーマを使用していますが、ドロップダウンを「サブメニュー」から「.dropdown-menu」に変更します

1
Devin Walker

:not( '。baz')をトップレベルセレクターに追加します。

0
Dave Ward