Wie kann man HTMLCollection-Elemente korrekt durchlaufen und ihre IDs abrufen?

For-Schleife für HTMLCollection-Elemente

Erläuterung

Sie versuchen, eine HTMLCollection zu durchlaufen und die ID jedes Elements abzurufen. Ihr erster Ansatz ist jedoch falsch. Durch die Verwendung von for (Schlüssel in Liste) iterieren Sie über die Schlüssel der HTMLCollection, die die Indizes der Elemente sind.

Richtiger Ansatz

Um über die HTMLCollection-Objekte selbst zu iterieren und Um auf ihre IDs zuzugreifen, können Sie den folgenden Befehl verwenden:

1. for/of-Schleife (moderne Browser)

Für moderne Browser, die die ES6 for/of-Syntax unterstützen, können Sie den folgenden Code verwenden:

var list = document.getElementsByClassName("events");
for (let item of list) {
    console.log(item.id);
}

2. for-Schleife mit Längeneigenschaft

Für Browser, die die for/of-Syntax nicht unterstützen, können Sie den folgenden Code verwenden:

var list = document.getElementsByClassName("events");
for (var i = 0; i < list.length; i++) {
    console.log(list[i].id);
}

Vermeiden Sie die Verwendung von for/in

Verwenden Sie for/in nicht zum Durchlaufen von HTMLCollections. Es ist für die Iteration über Objekteigenschaften gedacht, was zu unerwartetem Verhalten bei HTMLCollection-Objekten führen kann.

Zusammenfassung

Bedenken Sie, dass für moderne Browser der empfohlene Ansatz darin besteht, die for/of-Syntax zu verwenden, while Bei älteren Browsern funktioniert die for-Schleife mit der Längeneigenschaft. Vermeiden Sie die Verwendung von for/in für HTMLCollections.

Das obige ist der detaillierte Inhalt vonWie kann man HTMLCollection-Elemente korrekt durchlaufen und ihre IDs abrufen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!