jqueryで特定の属性値を持つすべての要素を検索します


88

特別な属性値を持つすべての要素を見つける必要があります。

これが私が見つける必要のあるdivです(私はそれらの多くを持っています..)

<div imageId='imageN'>...

私は単に持っているdivをループする必要があります imageId='imageN'


6
class="imageN"有効なHTMLのために使用することをお勧めします。それかdata-imageId="imageN"、有効なHTML5のために。前者を使用すると、クラスセレクターを使用できるようになります。
アンディE

Andy、この背後にある理由は、これらのdivはコードビハインドから動的に追加され、異なるImageIdを持ちますが、クラスは同じです。
pabuc 2011

3
class="image imageN"それが助けになるなら、uは複数のクラスを持つことができます。
Val

すでに同じクラスを持っている場合は、クラス名を選択してみませんか?
プラクシスアシェリン2013年

回答:


142
$('div[imageId="imageN"]').each(function() {
    // `this` is the div
});

属性の唯一の存在を確認するには、どの値に関係なく、代わりに次のセレクターを使用できます。 $('div[imageId]')


4
@ ThiefMaster-属性値が一定でない場合(つまり、変化する場合)、それを見つける方法は?
開発者

いくつかの質問:1-他の要素についてはどうですか... 2-他の値についてはどうですか...私は属性data-foodを多くの要素に持っているかもしれません:div、img、td、それぞれが異なる値を持っています。
dsdsdsdsd 2013年

@ParthoGanguly変数は次のように使用します:$( 'div [imageId = "' + variableName + '"]')
Kama

1
この解決策は、このページのタイトルに実際には答えていません。divである要素を検索しています。適切な解決策は、実際の要素にとらわれない解決策です。
AndroidDev 2017

164

質問に正確に答えることはできませんが、(属性値でフィルタリングせずに)単に特定の属性名を持つ要素(異なるタグ名の可能性がある)のコレクションを取得する方法を探しているときにここにたどり着きました。私は次のことが私にとってうまくいくことがわかりました:

$("*[attr-name]")

私がいたのと同じものを探してこのページにたまたま着陸した誰かを助けることを願っています:)。

更新:アスタリスクは不要のようです。つまり、いくつかの基本的なテストに基づくと、以下は上記と同等のようです(これを指摘してくれたMattに感謝します)。

$("[attr-name]")

完璧!まさに私が探していたもの。
Paulius Matulionis 2013年

おそらく...私はパフォーマンスの側面をチェックしませんでした(当時の私の使用にとって重要な要素ではありませんでした)。
sammy34 2014年

3
それとの間に違いはあります$("[attr-name]")か?(つまり、いいえ*
マシュー

はい、それらの間には一定の違いがあります。スター表記はFirefoxでエラーを発生させます!!!! (エスケープされていない...)
ozz 2014年

これに加えて、属性値を含めることもできます。例:$("[data-toggle='modal']")
MeltingDog 2016

12

タグとは呼ばれません。あなたが探しているものはhtml属性と呼ばれます。

$('div[imageId="imageN"]').each(function(i,el){
  $(el).html('changes');
  //do what ever you wish to this object :) 
});

5

属性の部分的な値を使用して、(^)記号を使用してDOM要素を検出できます。たとえば、次のようなdivがあります。

<div id="abc_1"></div>
<div id="abc_2"></div>
<div id="xyz_3"></div>
<div id="xyz_4"></div>...

次のコードを使用できます。

var abc = $('div[id^=abc]')

これにより、IDがabc:で始まるdivのDOM配列が返されます。

<div id="abc_1"></div>
<div id="abc_2"></div>

これがデモです:http//jsfiddle.net/mCuWS/


4

文字列の連結を使用します。これを試して:

$('div[imageId="'+imageN +'"]').each(function() {
    $(this);   
});
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.