複数のクラスを持つ要素を順番に選択する方法

Question

2つのクラスaとb、の順番でのすべての要素を選択したいとします。

<element class="a b"> 

$（ ".a + .b"）を使用すると、どちらのクラスでもどちらの順序でも要素が取得されます。 class = "a b"ででない要素のみが必要です。 class = "b a"ではありません。私はjavascriptのgetElementsByClassNameを使用して同じ問題を抱えています。

注：注文を指定する理由は、ドキュメントの一部のdivがclass = "a b"で、一部に "b a"があることです。 。 。私は "a b"を持つものだけを選びたいと思う。文書はエレガントに構成されていませんが、それは私のコントロールではありません。これらの要素は、他のクラスを持っていない場合は

Answer 1

、あなたは属性によってそれらを選択することができますがありまた、属性-開始-とだ、と-ends-とセレクタ、およびセレクタを属性は、含まれてい

$('[class="a b"]') 

、それは希望彼らは複数のクラス

$('[class*="a b"]') 

ノートを持っていた場合でも、要素を拾う：これも...class="what a bad idea"

にマッチします210

プレーンJSは属性セレクタをサポートしていますquerySelector[All]

しかし、これは悪い考えです。クラスの順序は関係ありません。何か間違っています。

Answer 2

アトリビュートリストは理想的にはある値に対してある値に優先度を与えるべきではありません。言い換えれば、注文は重要ではないと思われるので、ここでは疑わしいモデルがあるかもしれません。

しかし、あなたの質問に答えるには、正規表現のようなものが必要になるでしょう。

$('*').filter(function() { return /\ba\b.*\bb\b/.test(this.className); }); 

[編集]

とBの間に、他のクラスのいずれかのチャンスがあります場合、これはより寛容です。しかし、Adaneoの答えが示すとおり、それらの2つだけが存在することが確実であれば、属性セレクタを使用することができます。

Answer 3

他のクラスも、あなたがJSFiddle見ることができる。ここfilter()

$(".a.b").filter(function(){ 
    return this.className.indexOf('a b')>-1; 
}) 

Answer 4

を使用することができます関与している場合：https://jsfiddle.net/d002g7n8/1/

$('.a.b') 

    .filter(function(){ 

     return this.classList[0] == 'a' && this.classList[1] == 'b'; 

    }) 
    .addClass('selection'); 

我々は最初の要素を選択し、クラスを持っているものをフィルタリング「を初めは「b」、2位は「b」だった。

Answer 5

セレクタ$（ "。a +。B "）は、DOM内のクラスbと第二の要素のためです：

<element class="a"> 
<element class="b"> 

またはこの：

<element class="a b"> 
<element class="a b"> 

セレクタ+について：http://www.w3schools.com/cssreF/sel_element_pluss.asp

あなたの質問のためにあなたは、フィルタと、このセレクタを使用することができます：

$('.a.b').filter(function() { 
    return $(this).attr('class') == 'a b'; 
})