JavaScript：当我尝试使用 DOM 时，我的 for 循环似乎不起作用答案

【问题标题】：JavaScript: My for loop seems to be not working when I am trying to work with DOMJavaScript：当我尝试使用 DOM 时，我的 for 循环似乎不起作用
【发布时间】：2019-05-09 13:17:15
【问题描述】：

问题是，问题似乎来自 for 循环本身。例如，当我删除其中的代码并输入alert(c); 时，它什么也没做。我之前用同样的方法做了一点不同的事情，而且效果很好。这是我对之前的问题所做的：

for (var b = 0; b <= 99; b++) {
    var boxTwo = document.querySelectorAll(".icon2.windowbg[style]")[b];
    boxTwo.style.backgroundColor = "#552222";
}

它工作得很好。不幸的是，我不能对我的新问题说同样的话：

for (var c = 0; c <= 99; c++) {
    var boxOneNew = document.querySelectorAll(".icon1.windowbg.topicnew")[c];
    boxOneNew.style.backgroundColor = "#552222";
}

【问题讨论】：

document.querySelectorAll(".icon1.windowbg.topicnew") 它会返回任何东西吗？控制台有错误吗？
请分享您的 HTML。您的选择器似乎没有选择 100 个不同的元素，因为它需要此代码不引发错误

标签： javascript loops for-loop dom

【解决方案1】：

您必须将 boxTwo 从循环中取出，并且循环条件应为 boxTwo.length 以防止出现错误 style of null，除非您的 boxTwo 长度为 98。

var boxTwo = document.querySelectorAll(".icon2.windowbg[style]");
for (var b = 0; b < boxTwo.length; b++) {
  boxTwo[b].style.backgroundColor = "#552222";
}

为您的第二个代码也这样做：

var boxOneNew = document.querySelectorAll(".icon1.windowbg.topicnew");
for (var c = 0; c < boxOneNew.length; c++) {
  boxOneNew[c].style.backgroundColor = "#552222";
}

注意：确保 .icon1.windowbg.topicnew 匹配 DOM 中的某些内容。

【讨论】：

这也应该与第二个代码一起使用吗？正如我所说，第一个没有问题。但它的方法似乎不适用于第二种方法。没关系，你编辑了你的评论。
更新了我的答案

【解决方案2】：

如你所愿，

<td class="icon1 windowbg topicnew">...</td>

代码的另一部分几乎相同，只是没有'topicnew' 类。我想要做的是改变这个元素的背景颜色。是的，有 99 个元素。

【讨论】：