Heim >Web-Frontend >HTML-Tutorial >Verstehen Sie die Verwendung von NodeList, HTMLCollection und NamedNodeMap (Code)
Verstehen Sie die Verwendung von NodeList, HTMLCollection und NamedNodeMap (Code)
- 云罗郡主nach vorne
- 2018-10-17 14:53:042082Durchsuche
Der Inhalt dieses Artikels befasst sich mit dem Verständnis der Verwendung (des Codes) von NodeList, HTMLCollection und NamedNodeMap. Ich hoffe, dass er für Sie hilfreich ist.
Diese drei sind arrayartige Objekte.
HTMLCollection enthält nur Elementknoten, während NodeList jeden Knotentyp enthält.
Das HTMLCollection-Objekt kann die Methoden „item()“ und „namedItem()“ aufrufen, und das NodeList-Objekt kann nur die Methode „item()“ aufrufen. Beim Abrufen von Elementen kann beides über die eckige Klammersyntax oder die Methode item() erfolgen. Mit dem HTMLCollection-Objekt können Sie Elemente abrufen, indem Sie über die Methode „namedItem()“ einen Namen oder eine ID übergeben.
Einige Methoden in älteren Browsern (z. B. getElementsByClassName()) geben NodeList-Objekte anstelle von HTMLCollection-Objekten zurück. Die childNodes-Eigenschaft aller Browser gibt ein NodeList-Objekt zurück. Die Funktion querySelectorAll() der meisten Browser gibt ein NodeList-Objekt zurück. getElementsByTagName() gibt ein HTMLCollection-Objekt zurück.
Das NamedNodeMap-Objekt wird über das Attribut node.attributes abgerufen und ein Pseudo-Array-Objekt erhalten, das aus allen Attributen des Elements besteht.
Beispiel:
<body>
<p>
<a href="#" id="a1">1</a>
<a href="a.html" name="a2">2</a>
</p>
</body>
<script>
// 获取一个HTMLCollection对象
var res = document.getElementsByTagName("a");
console.log(res);
console.log(res.item(0))
console.log(res[0])
console.log(res.namedItem('a1'))
console.log(res.namedItem('a2'))
// 结果如下图所示：
</script> "153975910994667Verstehen Sie die Verwendung von NodeList, HTMLCollection und NamedNodeMap (Code)")
Das Obige ist eine vollständige Einführung in die Verwendung (Code) von NodeList, HTMLCollection und NamedNodeMap, falls Wenn Sie mehr über HTML-Video-Tutorial erfahren möchten, schauen Sie sich bitte die chinesische PHP-Website an.
Das obige ist der detaillierte Inhalt vonVerstehen Sie die Verwendung von NodeList, HTMLCollection und NamedNodeMap (Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!