一尘不染

如何使用document.querySelectorAll遍历所选元素

javascript

我正在尝试对通过document.querySelectorAll查询的选定元素进行循环,但是如何?

例如,我使用:

var checkboxes = document.querySelectorAll('.check');
for( i in checkboxes) {
  console.log(checkboxes[i]);
}

输出:

<input id="check-1" class="check" type="checkbox" name="check">
<input id="check-2" class="check" type="checkbox" name="check">
<input id="check-3" class="check" type="checkbox" name="check">
<input id="check-4" class="check" type="checkbox" name="check">
<input id="check-5" class="check" type="checkbox" name="check">
<input id="check-6" class="check" type="checkbox" name="check">
<input id="check-7" class="check" type="checkbox" name="check">
<input id="check-8" class="check" type="checkbox" name="check">
<input id="check-9" class="check" type="checkbox" name="check">
<input id="check-10" class="check" type="checkbox" name="check" checked="">

10
item()
namedItem()

我的问题是,最后此方法返回了3个额外的项目。我该怎么做呢?


阅读 571

收藏
2020-05-01

共1个答案

一尘不染

for in不建议对数组和类似数组的对象使用循环-您会明白为什么。不仅可以有数字索引项,例如length属性或某些方法,还for in可以遍历所有这些项。使用任一

for (var i = 0, len = checkboxes.length; i < len; i++) {
    //work with checkboxes[i]
}

要么

for (var i = 0, element; element = checkboxes[i]; i++) {
    //work with element
}

如果数组中的某些元素可能是虚假的(不是您的情况),则无法使用第二种方法,但是由于您不需要在[]所有地方都使用表示法,因此第二种方法更具可读性。

2020-05-01