Heim  >  Artikel  >  Web-Frontend  >  Einführung in DOM und Knoten, Attribute und Suchknoten

Einführung in DOM und Knoten, Attribute und Suchknoten

小云云
小云云Original
2018-01-18 14:45:392042Durchsuche

Dieser Artikel bietet Ihnen hauptsächlich eine detaillierte Einführung in DOM, Knoten, Attribute und Methoden zum Finden von Knoten. Ich hoffe, dass er für alle hilfreich ist. Ich hoffe, es kann für alle hilfreich sein.

DOM (Document Object Model)-Programmierschnittstelle zum Betreiben von Dokumenten

DOM definiert Methoden zum Darstellen und Ändern von Dokumenten. CSS-Stylesheets können nicht geändert werden, um den CSS-Stil zu ändern Elemente, die dem Element im Wesentlichen Inline-Stile hinzufügen.

Das DOM-Objekt ist das Hostobjekt, das zum Betrieb einer Sammlung von HTML- und XML-Funktionsobjekten verwendet wird. xml ——>

Dokument, wenn es alleine geschrieben wird, stellt es das gesamte Dokument dar, implizit eine Ebene über dem HTML-Tag geschrieben, das nur das Stamm-Tag im Dokument ist.

Hinweis: BOM- und DOM-gruppierte Dinge sind arrayartig, keine Arrays.

Methoden zum Abrufen von Elementen:

getElementById();

Browser unter IE8 unterscheiden nicht zwischen ID-Werten in Groß- und Kleinschreibung und stimmen mit dem Attributwert des Elementnamens überein. Da der ID-Wert im Hintergrund geändert wird, versuchen Sie, ihn nicht oder weniger zu verwenden.

getElementsByTagName(); alle Browser unterstützen

getElementsByClassName(); Browser IE8 und niedriger unterstützen nicht

getElementsByName(); in älteren Versionen nur den Namen des Tags, das die Anfrage senden kann, wird wirksam (Formular, Formularelement, IMG, IFrame)

document.querySelector(); CSS-Selektor, IE7 und niedriger sind nicht kompatibel und nicht in Echtzeit.

document.querySelectAll();

Knotentyp:

Elementknoten 1

Attributknoten 2

Textknoten 3 // Text, Leerzeichen, Wagenrückläufe usw. sind alle Textknoten

Kommentarknoten 8

Dokumentknoten 9

Dokumentfragment 11

Traversal Anzahl der Knoten:

parentNode ist der übergeordnete Knoten des untergeordneten Knotens. Der letzte parentNode-Knoten ist der Dokumentknoten.

childNodes Alle untergeordneten Knoten des übergeordneten Knotens, Elementknoten, Kommentarknoten, Textknoten

firstChild erster untergeordneter Knoten

lastChild letzter untergeordneter Knoten

nextSibling nächster Geschwisterknoten

previousSibling vorheriger Geschwisterknoten

Anzahl der durchlaufenen Elementknoten: (außer untergeordnete Knoten, andere sind mit IE9 und niedriger nicht kompatibel)

parentElement Der übergeordnete Elementknoten von das Element. Der letzte übergeordnete Elementknoten ist das HTML-Element, und das Dokument ist ein eigenständiger Knoten.

Kinder sind die untergeordneten Knoten des Elements unter dem übergeordneten Element.

node.childElementCount === node.children.length Die Anzahl der untergeordneten Elementknoten des aktuellen untergeordneten Knotens. Verwenden Sie „children.length“.

firstElementChild Der erste untergeordnete Elementknoten

lastElementChild Der letzte untergeordnete Elementknoten

nextElementSibling, previousElemnetSibling

Die vier Attribute des Knotens:

nodeName Zusätzlich zu Elementknoten haben die zurückgegebenen Ergebnisse ein „#“ vor ihnen, und Elementknoten geben Tag-Namen in Großbuchstaben zurück, und die Typen sind schreibgeschützt.

nodeValue wird nur für Textknoten und Kommentarknoten verwendet und kann gelesen und geschrieben werden.

nodeType gibt eine Zahl zurück, die den entsprechenden Knotentyp darstellt. Schreibgeschützte

Attribute Die Attributsammlung des Elementknotens. Die Methode

node.hasChildNodes() bestimmt, ob im übergeordneten Knoten untergeordnete Knoten vorhanden sind, und das Rückgabeergebnis ist ein boolescher Wert.

Verwandte Empfehlungen:


Mehrere Möglichkeiten, Dom mit jQuery zu finden

React betreibt das echte DOM, um dynamisches Bottom-Saugen zu erreichen

Beispielfreigabe von JQuery-Selektor- und DOM-Knoten-Betriebsübungen

Das obige ist der detaillierte Inhalt vonEinführung in DOM und Knoten, Attribute und Suchknoten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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