javascript - 如何从节点获取元素

Question

根据我的理解，document.querySelector 返回一个 Node 对象。然后我可以对该对象调用 appendChild。

我执行以下代码将一堆 div 附加到我的容器 div:

var container = document.querySelector('.container');
for (var i = 0; i < 400; i++) {
  var block = document.createElement('div');
  block.className = 'block';
  container.appendChild(block);
}

最后得到以下结构:

<div class="container">
  <div class="block"></div>
  <div class="block"></div>
  ...
  <div class="block"></div>
</div>

如何循环遍历容器 div 中的每个元素并使用现有的 container 变量向其添加新类？

我试过这个:

...
container.childNodes[i].className = 'myClass';

看来我需要访问子 Node 的 Element 对象，但我不确定该怎么做。

Answer 1

你能不能在创建 div 时添加它？

var container = document.querySelector('.container');
for (var i = 0; i < 400; i++) {
  var block = document.createElement('div');
  block.className = 'block myClass';
  container.appendChild(block);
}