jQuery:要素のクラスとIDを同時に選択しますか?


170

クラスとIDを同時に選択したいリンクがいくつかあります。

これは、2つの異なる動作があるためです。リンクのクラスが1つのクラス名を取得すると、それらはある方法で動作します。リンクの同じクラスが別のクラス名を取得すると、それらは異なる動作をします。クラス名はjqueryで切り替えられます。

したがって、リンククラスとIDを同時に選択できる必要があります。これは可能ですか?

私はもう試した:

 $("a .save #country")

結果なし。

回答:


305

できるよ:

$("#country.save")...

または

$("a#country.save")...

または

$("a.save#country")...

あなたが好むように。

したがって、はい、ID クラス(そして場合によってはタグ名など、スローしたいものすべて)と一致する必要のあるセレクターを指定できます。


41
したがって、基本的には次のようになります。$( "#a .b")は、IDがaの要素内のクラスがbの要素を意味します。$( "#ab")は、クラスbおよびID aの要素を意味します。コツは#aと.bの間のスペースです
Bhumi Singhal

13
クラスの前にIDセレクターを使用するように注意してください。そうしないと機能しません。例:$( "。save#country")...は結果を返しません。
スロットモ

43

アレックスが提供した答えは私のために機能し、答えとして強調表示されたものではなかったことを追加するだけです。

これは私にはうまくいきませんでした

$('#country.save') 

しかし、これはそうしました:

$('#country .save') 

だから私の結論はスペースを使用することです。今私が使っているjQueryの新しいバージョン(1.5.1)に対するものかどうかはわかりませんが、とにかくこれが私が経験した同様の問題のある人に役立つことを願っています。

編集:(アレックスの答えへのコメントで)説明のための完全な信用は言うフェリックスクリングに行きます:

スペースは子孫セレクターです。つまり、ABは「Aに一致する要素の子孫であるBに一致するすべての要素を一致させる」を意味します。ABは、「AとBに一致するすべての要素を選択する」ことを意味します。したがって、それは実際に達成したいことに依存します。#country.saveおよび#country .save同等ではありません。


2
あなたが言った問題は「国」ではなく「国」ですか?
amindfv 2013

8

idとクラス識別子の間にスペースを追加すると機能します

$("#countery .save")...


1
$( '#countery.save')のように機能しなかったので、実際にこれは私のために働いたので、ありがとう!
ニコラ

1
私は時々それがスペースについてうるさいことがわかりました。$(。selector> .item#id)は機能しますが、$(。selector> .item #id)は機能しません。
安倍ペトリロ

21
スペースは子孫セレクターです。つまり、A B「Aに一致する要素の子孫である、Bに一致するすべての要素を一致させる」ことを意味します。AB「AとBに一致するすべての要素を選択する」という意味です。したがって、それは実際に達成したいことに依存します。#countery.saveおよび#countery .save同等ではありません。
Felix Kling 2012年

2

最後に、CSSと同じルールが適用されます。

ですから、この参照はいくつかの価値ある有用なものになると思います。


あなたの参照の内容を要約していただけますか?
krlmlr 2012年

実際、api.jquery.com / category / selectorsによると、jQueryには独自のセレクターがあります。また、実際にはすべてのCSS 1-3セレクターがサポートされているとは言えません...
SamB

@SamBその通りですが、CSS 1〜3を借用し、独自に追加していると言っています。W3Cに関するものへのリンクは、このディスカッションに対しても有効だと私はまだ思います。
akousmata 2013年


1
$("a.save, #country") 

「a.save」クラスと「country」IDの両方を選択します。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.