Zusammenfassung der jQuery-Knotendurchlaufmethoden

Dieser Artikel sammelt und organisiert hauptsächlich die Methoden zum Durchlaufen von jQuery-Knoten, damit jeder ein klareres Verständnis für das Durchqueren von jQuery-Knoten hat. Freunde, die es benötigen, können darauf verweisen kann jedem helfen.

1.children()-Methode: $('p').children()---Traverse und finde alle untergeordneten Elementknoten des p-Elements

<p>Hello</p>
<p>
  <span>Hello Again</span>
  <p class="box">您好!</p>
</p>
<p>And Again</p>
<script type="text/javascript">
  $('p').children();   //<span>Hello Again</span><p class="box">您好!</p>
  $('p').children('.box')  //<p class="box">您好!</p>
</script>

2.next( ) Methode :$('p').next() --- Benachbarte Geschwisterelemente nach dem p-Element finden, aber nicht alle Geschwisterelemente

　[Verwandte Methoden]

　(1)nextAll () Methode: $('p').nextAll() ---- Alle Geschwisterelemente nach p finden

　 (2) nextUntil() Methode: $('p').nextUntil(' p')- ---Finde alle Geschwisterelemente nach p bis zum p-Element

<p>Hello</p>
<p class="box">Hello Again</p>
<p>
  <span>And Again</span>
</p>
<script type="text/javascript">
  $('p').next();   //<p>Hello Again</p><p><span>And Again</span></p>
  $('p').next('.box');  //<p class="box">Hello Again</p>
</script>

3.prev()-Methode: $('p').prev() ---- Finde p Vorherige benachbarte Geschwisterelemente

[Verwandte Methoden umfassen]

(1) prevAll()-Methode: $('p').prevAll() ---- Suchen Sie die Elemente vor p Alle Geschwisterelemente

　(2) prevUntil()-Methode: $('p').prevUntil('p') --- Alle Elemente vor p bis zum p-Element finden

<p>Hello</p>
<p>
  <span>Hello Again</span>
</p>
<p>And Again</p>
<script type="text/javascript">
  $('p').prev();  //<p><span>Hello Again</span></p>
</script>

4.siblings()-Methode : $('p').siblings()---- Alle Geschwisterelemente vor und nach p finden

5.find()-Methode: $('p') .find('span') - --- Finden Sie das Unterelement innerhalb des p-Elements und es ist ein Span-Element

6.eq()-Methode: $('p').eq(1) --- Finden Sie die zweiten p-Elemente (Indexindex beginnt bei 0)

7.first()-Methode: $('li').first() --- Holen Sie sich das erste li-Element

8 .last()-Methode : $('li').last() --- Holen Sie sich das letzte li-Element

9.filter()-Methode: $('p').filter('.box' ) --- Holen Sie sich das p-Element mit dem Klassennamen box

10.is()-Methode: $('.box').is('p') ---- Bestimmen Sie, ob .box ein p-Element ist

11.map()-Methode: $('p').map(callback) --- Führen Sie die Callback-Funktion für jedes p

aus. Beispiel: Durchlaufen Sie das Eingabeelement, um seinen Wert "," zu erhalten wird am Ende des p-Elements hinzugefügt

<p><b>Values: </b></p>
<form>
 <input type="text" name="name" value="John"/>
 <input type="text" name="password" value="password"/>
 <input type="text" name="url" value="http://ejohn.org/"/>
</form>
<script type="text/javascript">
  $("p").append( $("input").map(function(){
     return $(this).val();
    }).get().join(", ") );  //<p>John, password, http://ejohn.org/</p> 
</script>

12.hasClass() Methode: $('p').hasClass('box') ---- Suchen Sie das Klassennamenfeld p

13.has() Methode: $('p').has('span') ---- Finden Sie p Elemente, die span-Elemente enthalten

14.not( ) Methode: $( 'p').not('span') ---- Finden Sie p-Elemente, die keine span-Elemente enthalten

15.slice()-Methode: $('p').slice (0,2) ---- Finden Sie das 1. p-Element bis zum 3. p-Element

16.offsetParent()-Methode: $('p').offsetParent() --- Finden Sie das p-Element Das erste positionierte Vorfahrenelement

17.parent() Methode: $('p').parent() ---- Gibt den Elementsatz zurück, der den eindeutigen übergeordneten Knoten des p-Elements enthält

18.parents() Methode: $('p').parent() ---- Gibt alle Vorgängerknoten zurück, die das p-Element enthalten (mit Ausnahme des Wurzelknotens)

19.parentUntil() Methode :$('p'). parentUntil('#box') ---- Finden Sie die Vorgängerelemente des p-Elements bis #box

20.contents()-Methode: $('p'contents()) --- Gibt alle zurück Untergeordnete Knoten (einschließlich Textknoten) innerhalb des p-Elements

21.end()-Methode: $('p').find('span').end() - --- Ändern Sie den Hauptteil des Die Aussage kehrt in den vorherigen Zustand zurück, das heißt: Nachdem das Span-Element gefunden wurde, kehrt der Fokus zum P-Element zurück

<p>
  <span>Hello</span>,
  how are you?
</p>
<script type="text/javascript">
  $('p').find('span').addClass('test').end().attr('title','title1');
  //span添加class=test;p添加title=title1
</script>

Verwandte Empfehlungen:

Ausführliche Erklärung von jQuery implementiert die Funktionen des dynamischen Hinzufügens von Knoten und des Durchlaufens von Knoten

Ein kleiner Satz von Methoden für Jquery zum Durchlaufen von Knoten_jquery

jQuery-Schleifendurchlauf zum Ändern die href eines Tags Ausführliche Erklärung

Das obige ist der detaillierte Inhalt vonZusammenfassung der jQuery-Knotendurchlaufmethoden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!