Heim > Web-Frontend > js-Tutorial > Hauptteil

So durchlaufen Sie Elemente in js

php中世界最好的语言
Freigeben: 2018-06-07 11:12:00
Original
2748 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie eine Elementdurchquerung in js durchführen und welche Vorsichtsmaßnahmen für die Elementdurchquerung in js gelten. Das Folgende ist ein praktischer Fall, schauen wir uns das an.

Zu den Browsern, die die Element Traversal-Spezifikation unterstützen, gehören IE 9+, Firefox 3.5+, Safari 4+, Chrome und Opera 10+.

Für Leerzeichen zwischen Elementen werden Dokumentknoten vor IE9 nicht zurückgegeben, und alle anderen Browser geben Dokumentknoten zurück.

Um mit den Unterschieden zwischen Browsern kompatibel zu sein, ohne den bestehenden DOM-Standard zu ändern, wurde die Element Traversal-Spezifikation erstellt.

Diese Spezifikation fügt 5 Attribute zu Elementen hinzu

childElementCount
firstElementChild
lastElementChild
previousElementSibling
nextElementSibling

Detaillierte offizielle Dokumentation; http: // www.w3.org/TR/ElementTraversal/

Für Leerzeichen zwischen Elementen geben Versionen vor IE9 keine Textknoten zurück, während andere Browser Leerzeichen als Textknoten zurückgeben. Dies führt zu inkonsistentem Verhalten bei der Verwendung der Eigenschaften childNodes und firstChild. Um diesen Unterschied auszugleichen und gleichzeitig die DOM-Spezifikation unverändert zu lassen, definiert die W3C-Element-Traversal-Spezifikation einen neuen Satz von Attributen.

Element Traversal API fügt DOM-Elementen die folgenden 5 Attribute hinzu:

  • childElementCount: Gibt die Anzahl der untergeordneten Elemente zurück (ohne Textknoten und Kommentare).

  • firstElementChild: Zeigt auf das erste untergeordnete Element.

  • lastElementChild: Zeigt auf das letzte untergeordnete Element.

  • previousElementSibling: Zeigt auf das vorherige Geschwisterelement.

  • nextElementSibling: Zeigt auf das nächste Geschwisterelement.

Unterstützte Browser haben diese Attribute zu DOM-Elementen hinzugefügt, sodass Sie sich keine Gedanken über leere Textknoten machen müssen, was das Auffinden von DOM-Elementen sehr erleichtert.

Hier ist ein Beispiel. Wenn Sie in der Vergangenheit alle untergeordneten Elemente eines Elements browserübergreifend durchlaufen wollten, mussten Sie Code wie den folgenden schreiben:

var i,len,child = element.firstChild;
while(child != element.lastChild){
 if(child.nodeType == 1){
  processChild(child);
 }
 child = child.nextSibling;
}
Nach dem Login kopieren

Mit den neuen Attributen von Element Traversal wird der Code sehr prägnant:

var i,len,child = element.firstElementChild;
while(child != element.lastElementChild){
 processChild(child);
 child = child.nextElementSibling;
}
Nach dem Login kopieren

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Wie man Vue bedient, um einen Proxy zu erstellen

Wie man mit Flackern beim V-Cloak umgeht wird in vue geladen

Das obige ist der detaillierte Inhalt vonSo durchlaufen Sie Elemente in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage