如何正确地遍历 HTMLCollection 元素并检索它们的 ID？

HTMLCollection 元素的 For 循环

说明

您正在尝试迭代 HTMLCollection 并检索每个元素的 ID。但是，您最初的方法是不正确的。通过使用 for (key in list)，您可以迭代 HTMLCollection 的键，即元素的索引。

正确方法

迭代 HTMLCollection 对象本身和要访问他们的 ID，您可以使用以下yöntemler：

1。 for/of 循环（现代浏览器）

对于支持 ES6 for/of 语法的现代浏览器，您可以使用以下代码：

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

2.带长度属性的 for 循环

对于不支持 for/of 语法的浏览器，可以使用以下代码：

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

避免使用 for/in

不要使用 for/in 来迭代 HTMLCollections。它用于迭代对象属性，这可能会导致 HTMLCollection 对象出现意外行为。

摘要

请记住，对于现代浏览器，推荐的方法是使用 for/of 语法，而对于较旧的浏览器，带有 length 属性的 for 循环方法将起作用。避免对 HTMLCollections 使用 for/in。

以上是如何正确地遍历 HTMLCollection 元素并检索它们的 ID？的详细内容。更多信息请关注PHP中文网其他相关文章！