javascript - 通过for循环将子div附加到每个div

我想将子div附加到每个给定的父div。应该通过调用decorateDiv()来装饰子div。

例如，在执行appendChildren之后，在div之后




应该采用以下形式(假设decorateDiv不执行任何操作)

function appendChildren()
{
var allDivs = document.getElementsByTagName("div");

for (var i = 0; i < allDivs.length; i++)
  {
   var newDiv = document.createElement("div");
   decorateDiv(newDiv);
   allDivs[i].appendChild(newDiv);
  }
}

// Mock of decorateDiv function for testing purposes
function decorateDiv(div) {}

我究竟做错了什么？

最佳答案

您遇到了.getElementsByTagName()返回实时 NodeList的事实。这意味着您要添加到页面的新<div>元素将立即成为列表的一部分。

您可以做的是事先将NodeList转换为普通数组:

var allDivs = document.getElementsByTagName("div");
allDivs = [].slice.call(allDivs, 0);

现在，在循环中使用“allDivs”会将新元素追加到最初寻找它们时所在的元素中。