Zusammenfassung der Methoden von JQuery zum Abrufen von Elementen

1. Beschreibung

Es gibt zwei Möglichkeiten, Elemente abzurufen: jQuery-Selektor und jQuery-Traversal-Funktion. In diesem Artikel teilen wir Ihnen eine Zusammenfassung der JQuery-Methode mit Ich hoffe, es kann allen helfen.

Erstellen Sie eine Zusammenfassung und festigen Sie Ihr Wissen.

2. Holen Sie sich selbst

1. Es wird nur ein jQuery-Selektor benötigt

选择器	实例	说明
#Id	$('#myId')	ID选择器： 可以获取到ID为“myId”的元素，区分大小写

Selektor

Instanz

Beschreibung

#Id

$('#myId')

ID-Selektor: Sie können die ID als Element erhalten von „myId“ unterscheidet zwischen Groß- und Kleinschreibung

2. Mehrere jQuery-Selektorkombinationen 元素元素

选择器	实例	说明
.class	$('.myClass')	类选择器：可以获取到class为‘myClass’的所有元素
element	$('p')	获取所有的 元素
:header	$(':header')	获取所有的标题元素： ~
:animated	$(':animated')	获取所有的动画元素
:contains(text)	$('p:contains(Hello)')	获取所有包含文本为Hello的 元素，中间的文本区分大小写
:hidden	$(':hidden')	获取所有的隐藏元素：width和height为0、display:none、type=hidden、
[attribute]	$('[href]')	属性选择器：获取所有含有属性为href的元素
[attribute=value]	$('[href=a.html]')	=   获取所有带有属性href，并且值为a.html的元素 !=  获取所有带有属性href，并且值不等于为a.html的元素 $=  获取所有带有属性href，并且值以a.html结尾的元素 ^=  获取所有带有属性href，并且值以a.html开头的元素 ~=  获取所有带有属性href，并且值包含单词”a.html“的元素 *=  获取所有带有属性href，并且值包含文本”a.html“的元素
:input	$(':input')	获取所有input元素
:radio	$(':radio')	所有带有 type="radio" 的 input 元素 相似的有： :text、:chexbox、:password、:submit、:reset、:button、:file
:enabled	$(':enabled')	所有启用的input元素。 :disabled  则相反
:checked	$(':checked')	所有选中的input选择（单选框、复选框）
:gt(index)	$('p:gt(2)')	index从0开始，获取index大于（不包含）2的所有 元素
:lt(index)	$('p:lt(2)')	index从0开始，获取index小于（不包含）2的所有 元素
:even	$('tr:even')	所有偶数
:odd	$('tr:odd')	所有奇数

In zwei Teile unterteilt: Die erste Hälfte erhält eine Sammlung von Elementen, und die zweite Hälfte kann genau ein Element sein. Durch die Kombination der beiden können Sie die gewünschten Elemente erhalten.

1) Auswahl der ersten Hälfte

tr>Alle Eingabeelemente mit type="radio"

Ähnliche umfassen:

:text, :chexbox, :password, :submit, :reset, :button, :file

-Elemente$('tr:odd')-Elemente

Selektor	Instanz	Beschreibung
/td>	$('.myClass')	Klassenselektor: Sie können alle Elemente mit der Klasse „myClass“ abrufen
element td>	$('p')	Alle -Elemente abrufen
:header	$( ':header')	Alle Header-Elemente abrufen: ~
:animated td>	$ (':animated')	Alle animierten Elemente abrufen
:contains(text)	$('p:contains( Hallo)')	Alle -Elemente abrufen, die den Text Hallo, beim mittleren Text wird die Groß-/Kleinschreibung beachtet
:hidden	$(':hidden')	Alle ausgeblendeten Elemente abrufen: Breite und Höhe sind 0, Anzeige:keine, Typ=versteckt,
[attribute]	$('[href]')	Attributselektor: Alle Elemente mit dem Attribut href abrufen
[attribute =value]	$('[href=a.html]')	= Ruft alle href-Attribute und das Element ab, dessen Wert a.html ist != Ruft alle Elemente mit dem Attribut href ab und der Wert ist nicht gleich a.html $= Ruft alle Elemente mit dem Attribut href ab und Elemente, deren Wert mit a.html ^= Alle Elemente mit dem Attribut href abrufen und deren Wert mit a.html beginnt ~= Alle Elemente mit dem Attribut href abrufen und deren Wert Elemente mit dem Wort „a.html“ enthält *= Alle Elemente mit dem Attribut href und dem Wert abrufen, der den Text „a.html“ enthält
:input	$(' :input')	Alle Eingabeelemente abrufen
:radio	$(':radio')
:enabled	$(':enabled') td>	Alle aktivierten Eingabeelemente. :disabled ist das Gegenteil
:checked	$(':checked')	Alle ausgewählten Eingabeauswahlen (Optionsfelder). , Kontrollkästchen)
:gt(index)	$('p:gt(2)')	index Wird gestartet Von 0 erhalten Sie alle -Elemente mit einem Index größer als (ausgenommen) 2
:lt(index)	$('p: lt (2)')	Der Index beginnt bei 0 und ruft alle -Elemente ab, deren Index kleiner als (ohne) 2 ist
:even	$('tr:even')	Alle geraden
:odd	Alle ungeraden

🎜>

选择器	实例	说明
:first	$('p:first')	第一个 元素
:last	$('p:last')	最后一个 元素
:eq(index)	$("p:eq(1)")	第二个 元素，index从0开始

2) Die zweite Hälfte des Selektors: kann auf ein bestimmtes Element :last tbody>

Selektor	Instanz	Beschreibung
:first	$('p:first')	Der Erste element
$('p:last')	Das letzte
:eq( index)	$("p:eq(1)")	Das zweite Element, Index beginnt bei 0

3. jQuery-Selektor + Durchlauffunktion

ist ebenfalls in zwei Teile unterteilt: Die erste Hälfte verwendet den Selektor, um eine zu erhalten Elementsatz, die zweite Hälfte verwendet die Traversal-Funktion, um ein bestimmtes Element genau zu identifizieren

1) Die erste Hälfte ist die gleiche wie oben

2) Die zweite Hälfte: die Traversal-Funktion

方法	描述
eq()	返回带有被选元素的指定索引号的元素
first()	返回被选元素的第一个元素
last()	返回被选元素的最后一个元素

3. Holen Sie sich das Geschwisterelement

Wie der Name schon sagt: Holen Sie sich das Geschwister des ausgewählten Elements Element. Zuerst müssen Sie das Element lokalisieren ( wurde oben zusammengefasst und wird nicht wiederholt ) und dann seine Geschwisterelemente abrufen.

1) Selektor

$( 'p ~ p')

选择器	实例	说明
element + next	$('p + p')	每个p相邻的下一个 元素
element ~ siblings	$('p ~ p')	获取跟p同级的所有的 元素

Selektor

td>

Instanz

Beschreibung

Element + nächstes

$( 'p + p')

Das nächste

-Element neben jedem p

Element ~ Geschwister

Erhalten Sie alle

-Elemente auf derselben Ebene wie p

方法	描述
next()	返回被选元素的后一个同级元素
nextAll()	返回被选元素之后的所有同级元素
prev()	返回被选元素的前一个同级元素
prevAll()	返回被选元素之前的所有同级元素

2) Traversal-Funktion

tr>

Methode td>	Beschreibung
next()	Gibt das nächste gleichgeordnete Element des ausgewählten Elements zurück
nextAll()	Gibt alle gleichgeordneten Elemente nach dem ausgewählten Element zurück
prev( )	Gibt das vorherige Geschwisterelement des ausgewählten Elements zurück
prevAll()	Gibt alle Geschwisterelemente vor dem ausgewählten Element zurück. Ebenenelemente

4. Holen Sie sich das übergeordnete Element

Holen Sie sich das

übergeordnete

选择器	实例	说明
:parent	$('p:parent')	获取所有p元素的父级元素

-Element

des

ausgewählten Elements

1) Selektor

Selektor

Instanz

方法	描述
parent()	获取被选元素的父级元素
parents()	获取被选元素的所有祖先元素

Beschreibung

:parent

$('p:parent')

Alle p-Elemente abrufen Das übergeordnete Element von

2) Traversalfunktion

选择器	实例	说明
parent > child	$('p > p')	获取p直接子元素的所有 元素
parent descendant	$('p p')	获取p所有后代的 元素

5. Holen Sie sich das untergeordnete Element

Holen Sie sich das
des

ausgewählten Elements

Untergeordnetes

Element

1) Selektor

方法	描述
children()	返回被选元素的所有直接子元素
contents()	返回被选元素的所有直接子元素(包含文本和注释节点)
find()	返回被选元素的后代元素

Instanz

selection Device	Beschreibung
parent > 'p > p')	Ruft alle -Elemente ab, die direkte untergeordnete Elemente von p sind
übergeordneter Nachkomme	$('p p')	Holen Sie sich die -Elemente aller Nachkommen von p

2) Traversal-Funktion

Methode	Beschreibung
children()	Gibt alle direkten untergeordneten Elemente zurück Elemente des ausgewählten Elements
contents()	Gibt alle direkten untergeordneten Elemente des ausgewählten Elements zurück (einschließlich Text- und Kommentarknoten)
find()	Gibt die Nachkommenelemente des ausgewählten Elements zurück

Der obige Inhalt ist eine Zusammenfassung der JQuery-Methode zum Abrufen von Elementen. Ich hoffe, dass er allen helfen kann. Verwandte Empfehlungen: Detaillierte Erläuterung der Instanz der jQuery-Element-Index()-MethodeVerwendung von JQuery-Elementen, Umschließen von Elementen und Einfügen von Elementattributen Detaillierte Erklärungjquerys Methode zum Erhalten des Elementwerts (gemeinsame Formelemente)_jquery

Das obige ist der detaillierte Inhalt vonZusammenfassung der Methoden von JQuery zum Abrufen von Elementen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!