web-dev-qa-db-ja.com

jQuery ORセレクタ？

私はjQueryのセレクタで "OR"ロジックを持つ方法があるかどうか疑問に思います。たとえば、ある要素がclassAクラスまたはclassBクラスの要素の子孫であることがわかり、elem.parents('.classA or .classB')のようなことをしたいのです。 jQueryはそのような機能を提供しますか？

jqueryjquery-selectors
308
Suan

コンマを使用してください。

'.classA, .classB'

スペースを省略することもできます。

473
Daniel A. White

結合する必要があるjQueryオブジェクトが複数ある場合は、コンマを使用するだけでは不十分な場合があります。

。add（） メソッドは、選択された要素を結果セットに追加します。

// classA OR classB
jQuery('.classA').add('.classB');

'.classA, .classB'よりも冗長ですが、次のようなより複雑なセレクタを構築することができます。

// (classA which has <p> descendant) OR (<div> ancestors of classB)
jQuery('.classA').has('p').add(jQuery('.classB').parents('div'));
68
Alp

私はまさにこの機能性のために信じられないほど単純な（5行のコード）プラグインを書きました：

http://byrichardpowell.github.com/jquery-or/

「この要素を取得するか、その要素が存在しない場合はこの要素を使用する」と効果的に言うことができます。例えば：

$( '#doesntExist' ).or( '#exists' );

受け入れられた回答がこれと同様の機能を提供しますが、両方のセレクタ（コンマの前後）が存在する場合、両方のセレクタが返されます。

Google経由でこのページにアクセスする可能性のある人にお役立てください。

21
By Richard Powell

Element = element1 ||の標準的な構成要素を使用したい場合JavaScriptが真実である最初のものを返すelement2では、あなたはまさにそれをすることができます：

element = $('#someParentElement .somethingToBeFound') || $('#someParentElement .somethingElseToBeFound');

これは実際に見つかった最初の要素を返します。しかし、もっと良い方法はおそらくjQueryセレクターのコンマ構文（見つかった要素の配列を返す）をこのように使うことでしょう：

element = $('#someParentElement').find('.somethingToBeFound, .somethingElseToBeFound')[0];

これは最初に見つかった要素を返します。

私は時々それを使ってリストの中のアクティブな要素、あるいはアクティブな要素がなければデフォルトの要素を見つけます。例えば：

element = $('ul#someList').find('li.active, li:first')[0]

activeクラスのliを返すか、存在しない場合は最後のliだけを返します。

どちらでも動作します。しかし、||として潜在的なパフォーマンスペナルティがあります。それが何か真実を見つけるとすぐに処理を停止しますが、配列アプローチはそれが既にそれを見つけたとしてもすべての要素を見つけようとします。それから、||を使って戻り値のセレクターを見つける前にいくつかのセレクターを通過する必要がある場合、コンストラクトはパフォーマンス上の問題を引き起こす可能性があります。それは論理的に思えるかもしれません）。ただし、一般的には、セレクタがかなり長い文字列の場合は配列アプローチを使用します。

14
Ken Dickinson

最後に、私はそれを行う方法をハックしました：

div:not(:not(.classA,.classB)) > span

（クラスclassA OR classBで直接子スパンを持つdivを選択します）

0
midlan