DieHTMLCollection-Schnittstelle repräsentiert eine generische Sammlung (Array-ähnliches Objekt ähnlich wiearguments) von Elementen (in Dokumentreihenfolge) und bietet Methoden und Eigenschaften zum Auswählen aus der Liste.

EineHTMLCollection im HTML-DOM ist live; sie wird automatisch aktualisiert, wenn das zugrunde liegende Dokument geändert wird. Aus diesem Grund ist es eine gute Idee, eine Kopie zu erstellen (z. B. mitArray.from), um darüber zu iterieren, falls Sie Knoten hinzufügen, verschieben oder entfernen.

Diese Schnittstelle wird aus historischen GründenHTMLCollection genannt, da vor der modernen DOM-Implementierung Sammlungen, die diese Schnittstelle implementierten, nur HTML-Elemente als ihre Elemente haben konnten.

Diese Schnittstelle war einVersuch, eine nicht modifizierbare Liste zu erstellen und wird nur weiterhin unterstützt, um Code nicht zu brechen, der sie bereits verwendet. Moderne APIs repräsentieren Listenstrukturen mit Typen, die auf JavaScript-Arrays basieren, wodurch viele Array-Methoden verfügbar werden und gleichzeitig zusätzliche Semantiken für ihre Verwendung auferlegt werden (wie die Festlegung, dass ihre Elemente schreibgeschützt sind).

Diese historischen Gründe bedeuten nicht, dass Sie als EntwicklerHTMLCollection vermeiden sollten. Sie erstellenHTMLCollection-Objekte nicht selbst, sondern erhalten sie von APIs wieDocument.getElementsByClassName(), und diese APIs sind nicht veraltet. Seien Sie jedoch vorsichtig mit den semantischen Unterschieden zu einem echten Array.

Instanz-Eigenschaften

HTMLCollection.lengthSchreibgeschützt

Gibt die Anzahl der Elemente in der Sammlung zurück.

Instanz-Methoden

HTMLCollection.item()

Gibt das spezifische Element an der gegebenen nullbasiertenindex-Position in der Liste zurück. Gibtnull zurück, wenn derindex außerhalb des Bereichs liegt.

Eine Alternative zum Zugriff aufcollection[i] (was stattdessenundefined zurückgibt, wenni außerhalb des Bereichs liegt). Dies ist hauptsächlich nützlich für nicht-JavaScript-DOM-Implementierungen.

HTMLCollection.namedItem()

Gibt den spezifischen Knoten zurück, dessen ID oder, falls dies nicht möglich ist, Name mit der durchname angegebenen Zeichenfolge übereinstimmt. Das Zuordnen nach Name erfolgt nur als letzter Ausweg, nur in HTML und nur, wenn das referenzierte Element dasname-Attribut unterstützt. Gibtnull zurück, wenn kein Knoten mit dem angegebenen Namen existiert.

Eine Alternative zum Zugriff aufcollection[name] (was stattdessenundefined zurückgibt, wennname nicht existiert). Dies ist hauptsächlich nützlich für nicht-JavaScript-DOM-Implementierungen.

Verwendung in JavaScript

HTMLCollection bietet auch Zugriff auf seine Mitglieder als Eigenschaften nach Namen und Index. HTML-IDs können: und. als gültige Zeichen enthalten, was die Verwendung der Klammernotation für den Eigenschaftszugriff erforderlich machen würde. Derzeit erkennt einHTMLCollection-Objekt keine rein numerischen IDs, die zu einem Konflikt mit dem array-ähnlichen Zugriff führen würden, obwohl HTML diese erlaubt.

Zum Beispiel, angenommen es gibt ein<form>-Element im Dokument und seineid istmyForm:

let elem1, elem2;// document.forms is an HTMLCollectionelem1 = document.forms[0];elem2 = document.forms.item(0);alert(elem1 === elem2); // shows: "true"elem1 = document.forms.myForm;elem2 = document.forms.namedItem("myForm");alert(elem1 === elem2); // shows: "true"elem1 = document.forms["named.item.with.periods"];

Spezifikationen

Browser-Kompatibilität

Siehe auch

• NodeList
• HTMLFormControlsCollection,HTMLOptionsCollection