\*") - Wählt die untergeordneten Elemente aller Absatzelemente aus. $ ("#SpecialId") - Wählen Sie das Element mit ID "SpecialId" aus. $ (". Sonderklasse") - Wählen Sie alle Klassen als "SPE"/> \*") - Wählt die untergeordneten Elemente aller Absatzelemente aus. $ ("#SpecialId") - Wählen Sie das Element mit ID "SpecialId" aus. $ (". Sonderklasse") - Wählen Sie alle Klassen als "SPE">
Heim >Web-Frontend >js-Tutorial >Top 50 JQuery Selektoren
jQuery -Selektoren sind leistungsstarke Tools, die jeder Entwickler im täglichen Leben verwendet. Diese Liste vereint 50 häufig verwendete JQuery -Selektoren als Referenz durch alle JQuery -Entwickler. Beachten Sie, dass diese Selektoren nicht in einer bestimmten Reihenfolge angeordnet sind.
$(“*”)
- Wählen Sie alle Elemente im Dokument aus. $(“p > *”)
- Wählen Sie die untergeordneten Elemente aller Absatzelemente aus. $(“#specialID”)
- Wählen Sie das Element mit ID "SpecialId" aus. $(“.specialClass”)
- Wählen Sie alle Elemente mit der Klasse als "Spezialklasse" aus. $(“li:not(.myclass)”)
- Wählen Sie alle Elemente aus, die mit der Auswahl li
übereinstimmen, aber Elemente ausschließen, deren Klasse "Myclass" ist. $(“a#specialID.specialClass”)
- Wählen Sie das Link -Element mit ID "SpecialId" und Klasse "SpecialClass" aus. $(“p a.specialClass”)
- Wählen Sie das Link -Element im Absatzelement mit der Klasse "SpecialClass" aus. $(“ul li:first”)
- Wählen Sie das erste Listenelementelement der ungeordneten Liste aus. $(“#container p”)
- Wählen Sie alle Nachkommensabsatzelemente mit ID "Container" -Element aus. $(“li > ul”)
- Wählen Sie das nicht ordnungsgemäße Listenelement aller Listenelementelemente aus. $(“strong em”)
- Wählen Sie das kursive Element aus, das dem fett geratenen Element folgt. $(“p ~ ul”)
- Wählen Sie alle nicht ordnungsgemäßen Listenelemente aus, die dem Absatzelement folgen. $(“code, em, strong”)
- Wählen Sie den Code, das kursive oder das fette Element aus. $(“p strong, .myclass”)
- Wählen Sie die fett geratenen Elemente innerhalb des Absatzelements und alle Elemente, deren Klasse "Myclass" ist. $(“:empty”)
- Wählen Sie alle Elemente ohne Kinder aus. $(“p:empty”)
- Wählen Sie alle Absatzelemente ohne Kinderelemente aus. $(“div[p]”)
- Wählen Sie das Div -Element aus, das die Absatzelemente enthält. $(“p[.myclass]”)
- Wählen Sie das Absatzelement aus, das das Element "myclass" enthält. $(“a[@rel]”)
- Wählen Sie alle Linkelemente mit REL -Attribut aus. $(“input[@name=myname]”)
- Wählen Sie das Eingabeelement aus, dessen Namensattributwert genau gleich "myName" ist. $(“input[@name^=myname]”)
- Wählen Sie das Eingabeelement aus, dessen Namensattributwert mit "myName" beginnt. $(“a[@rel$=self]”)
- Wählen Sie das Link -Element mit dem Wert des Rel -Attributs, das mit "Selbst" endet. $(“a[@href*=domain.com]”)
- Wählen Sie das Link -Element mit dem HREF -Attributwert aus, der "Domain.com" enthält. $(“li:even”)
- Wählen Sie das Elementelementelement mit einem Indexwert von Said aus. $(“tr:odd”)
- Wählen Sie das Tabellenzeilenelement mit einem Indexwert von ungeraden Zahlen aus. $(“li:first”)
- Wählen Sie das erste Listenelementelement. $(“li:last”)
- Wählen Sie das letzte Listenelementelement aus. $(“li:visible”)
- Wählen Sie alle Elemente der sichtbaren Listenelemente aus. $(“li:hidden”)
- Wählen Sie alle Elemente der versteckten Listenelemente aus.$(“:radio”)
- Wählen Sie alle Optionszahlen im Formular aus. $(“:checked”)
- Wählen Sie alle ausgewählten Kontrollkästchen im Formular aus. $(“:input”)
- Wählen Sie Formularelemente aus (Eingabe, Wählen Sie, textarea, Schaltfläche). $(“:text”)
- Wählen Sie das Texteingangselement (input[type=text]
). $(“li:eq(2)”)
- Wählen Sie das Element der dritten Listenelement. $(“li:eq(4)”)
- Wählen Sie das Element der fünften Liste Element aus. $(“li:lt(2)”)
- Wählen Sie das Listenelementelement (erste zwei) vor dem dritten Element aus. $(“p:lt(3)”)
- Wählen Sie das Absatzelement vor dem vierten Element (erste drei) aus. $(“li:gt(1)”)
- Wählen Sie nach dem zweiten Element das Elementlistenelement. $(“p:gt(2)”)
- Wählen Sie das Absatzelement nach dem dritten Element aus. $(“div/p”)
- Wählen Sie das Subabsatzelement des Div -Elements aus. $(“div//code”)
- Wählen Sie alle Nachkommenscodeelemente des Div -Elements aus. $(“//p//a”)
- Wählen Sie Nachkommenslinkelemente für alle Absatzelemente. $(“li:first-child”)
- Wählen Sie alle Listenelementelemente aus, die das erste untergeordnete Element seines übergeordneten Elements sind. $(“li:last-child”)
- Wählen Sie alle Listenelementelemente aus, die das letzte untergeordnete Element seines übergeordneten Elements sind. $(“:parent”)
- Wählen Sie alle Elemente mit mindestens ein untergeordnetes Element (einschließlich Text) aus. $(“li:contains(second)”)
- Wählen Sie das Listenelementelement aus, das den Text "Second" enthält. $(“td:gt(4)”)
- Wählen Sie das fünfte und spätere Tabellenzellelement. $(“input:not(:checked)”)
- Wählen Sie alle nicht ausgewählten Eingabelemente aus. $(“div,span,p.myClass”)
- Wählen Sie ein Element aus, das einem der drei Selektoren entspricht. $(“input[id][name$=”man”]”)
- Wählen Sie ein Eingabelement aus, das sowohl das ID -Attribut als auch das Namensattribut mit "Mann" besitzt. JQuery Selector FAQs (FAQs)
entspricht dem Selektor, um ein Element auszuwählen, dessen Attributwert genau mit einem bestimmten Wert übereinstimmt, z. B. die Auswahl eines Elements mit einer bestimmten ID oder einer bestimmten Klasse. Das Attribut enthält Selektor wird verwendet, um das Element auszuwählen, das das angegebene Substring enthält, auch wenn der Wert nur Teil des Attributwerts ist.
Verwenden Sie Attribut Equals Selector: $(“element[name=’value’]”)
. Wählen Sie beispielsweise das Eingabeelement "Benutzername" aus: $(“input[name=’username’]”)
.
Attributstart -Selektor wird verwendet, um ein Element auszuwählen, dessen Attributwert mit einem angegebenen Zeichenfolge beginnt: $(“element[attribute^=’value’]”)
. Wählen Sie beispielsweise alle Elemente aus, deren ID mit "my": $(“[id^=’my’]”)
beginnt.
separate Selektoren mit Kommas: $(“div, p”)
Wählen Sie alle Div- und P -Elemente aus.
Verwenden Sie :first-child
Selektor: $(“element:first-child”)
.
Verwenden Sie :last-child
Selektor: $(“element:last-child”)
.
Verwenden Sie :even
Selektor: $(“element:even”)
.
Verwenden Sie :odd
Selektor: $(“element:odd”)
.
Verwenden Sie :contains()
Selektor: $(“element:contains(‘text’)”)
.
Verwenden Sie Attributauswahl: $(“element[attribute]”)
.
Ich hoffe, dieser umfassendere Leitfaden wird Ihnen hilfreich sein!
Das obige ist der detaillierte Inhalt vonTop 50 JQuery Selektoren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!