循环时更改数组中项目的样式不起作用

Question

我正在尝试使用 for 循环更改列表的 borderColor，所以我使用了以下代码：

var listedItems = document.getElementsByTagName("UL");
for (var i = 0; i < listedItems.length; i++){
    listedItems[i].style.borderColor = "red";
}

谁能告诉我为什么这不起作用？

将 listedItems[i] 与 if 语句中的其他内容进行比较似乎可行，但更改数组当前指向的元素无效。我很困惑。

Answer 1

您的代码应该可以工作。

前提是所有边框样式都已设置。如果您还没有设置 borderWidth 和 borderStyle，您将看不到颜色 :)

var listedItems = document.getElementsByTagName("UL");
    for (var i = 0; i < listedItems.length; i++){
        listedItems[i].style.borderStyle = "solid";
        listedItems[i].style.borderWidth = "1px";
        listedItems[i].style.borderColor = "red";
    }

<ul>
  <li>test</li>
  <li>test</li>
  </ul>

<ul>
  <li>test2</li>
  <li>test2</li>
  </ul>

或

var listedItems = document.getElementsByTagName("UL");
for (var i = 0; i < listedItems.length; i++){
    listedItems[i].style.border = "1px solid red";
}

循环时更改数组中项目的样式不起作用

Changing the style of an item in an array when looping through isn't working

javascript

arrays

styles

element