jQuery: Klasse und ID eines Elements gleichzeitig auswählen?

170

Ich habe einige Links, über die ich gleichzeitig Klasse und ID auswählen möchte.

Das liegt daran, dass ich zwei verschiedene Verhaltensweisen habe. Wenn eine Klasse von Links einen Klassennamen hat, verhalten sie sich auf eine Weise, wenn dieselben Klassen von Links einen anderen Klassennamen haben, verhalten sie sich anders. Die Klassennamen werden mit jquery umgeschaltet.

Ich muss also in der Lage sein, gleichzeitig eine Linkklasse UND eine ID auszuwählen. Ist das möglich?

Ich habe es versucht:

 $("a .save #country")

ohne Ergebnis.

jquery dom jquery-selectors css-selectors Ajsie
quelle

Antworten:

305

Du kannst tun:

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

ODER

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

ODER 

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

wie Sie es vorziehen.

Ja, Sie können also einen Selektor angeben, der mit ID und Klasse übereinstimmen muss (und möglicherweise den Tag-Namen und alles andere, was Sie einwerfen möchten).

Cletus
quelle
41
Im Grunde ist es so: $ ("# a .b") bedeutet Element mit Klasse b innerhalb von Element mit ID a. $ ("# ab") bedeutet Element mit Klasse b und ID a. Der Trick ist der Abstand zwischen #a und .b
Bhumi Singhal
13
Es muss darauf geachtet werden, dass Sie vor dem Unterricht den ID-Selektor verwenden, da dies sonst nicht funktioniert. Beispiel: $ (". Save # country") ... gibt keine Ergebnisse zurück.
Slotomo
43

Nur um hinzuzufügen, dass die Antwort, die Alex gegeben hat, für mich funktioniert hat und nicht die, die als Antwort hervorgehoben wird.

Dieser hat bei mir nicht funktioniert 

$('#country.save')

Aber dieser tat: 

$('#country .save')

Mein Fazit ist also, den Raum zu nutzen. Jetzt weiß ich nicht, ob es sich um die neue Version von jQuery handelt, die ich verwende (1.5.1), aber ich hoffe trotzdem, dass dies jedem mit ähnlichen Problemen hilft, die ich hatte.

edit: Die volle Anerkennung für die Erklärung (im Kommentar zu Alex 'Antwort) geht an Felix Kling, der sagt:

Das Leerzeichen ist der Nachkommen-Selektor, dh AB bedeutet "Alle Elemente übereinstimmen, die mit B übereinstimmen und Nachkommen von Elementen sind, die mit A übereinstimmen". AB bedeutet "Alle Elemente auswählen, die mit A und B übereinstimmen". Es kommt also wirklich darauf an, was Sie erreichen wollen. #country.saveund #country .savesind nicht gleichwertig.

Nikola
quelle
2
Ist das Problem, dass Sie "Countery" statt "Land" gesagt haben?
amindfv
8

Dies funktioniert, wenn Leerzeichen zwischen ID und Klassenkennung hinzugefügt werden

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

Alex
quelle
1
Eigentlich hat das bei mir funktioniert, da es nicht wie $ ('# countery.save') funktioniert hat. Also danke!
Nikola
1
Ich habe manchmal festgestellt, dass der Raum wählerisch ist. wie $ (. selector> .item # id) funktioniert, $ (. selector> .item #id) jedoch nicht.
Abe Petrillo
21
Das Leerzeichen ist der Nachkommen-Selektor , dh A B"Alle Elemente übereinstimmen, die mit B übereinstimmen und Nachkommen von Elementen sind, die mit A übereinstimmen". ABbedeutet "Alle Elemente auswählen, die mit A und B übereinstimmen". Es kommt also wirklich darauf an, was Sie erreichen wollen. #countery.saveund #countery .savesind nicht gleichwertig.
Felix Kling
2

Am Ende gelten die gleichen Regeln wie für CSS.

Daher denke ich, dass diese Referenz von wertvollem Nutzen sein könnte.

getack
quelle
Können Sie den Inhalt Ihrer Referenz zusammenfassen?
krlmlr
Laut api.jquery.com/category/selectors hat jQuery tatsächlich einige eigene Selektoren. Außerdem heißt es nicht, dass alle CSS 1-3-Selektoren unterstützt werden ...
SamB
@SamB Sie haben Recht, aber es heißt, es leiht sich von CSS 1-3 aus UND fügt seine eigenen hinzu. Ich denke immer noch, dass der Link zum W3C-Zeug für diese Diskussion gültig ist.
Akousmata
2

Wie wäre es mit diesem Code?

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

wählt sowohl die Klasse "a.save" als auch die ID "country" aus.

OK W
quelle