javascript - 如何为每个元素分配不同的 id

Question

我有两个列表，一个包含 span 元素的文本，我使用这个 forEach 循环分配：

spans.forEach(function(el) {
  const span = document.createElement('span');
  span.innerHTML = el;
  list.appendChild(span);
})

如何使用另一个列表为列表中的每个跨度分配一个 ID？两个列表都包含相同数量的元素，id[0] 应该分配给 text[0] 等等。

标签： javascript

Answer 1

您可以使用 的第二个参数来做到这一点forEach，如下所示：

let spans = ['one', 'two', 'three'];
let list = document.getElementById("list");

spans.forEach(function(el, i) {
  const span = document.createElement("span");
  span.innerHTML = el;
  span.id = spans[i];
  list.appendChild(span);
});

for (let child of list.childNodes) {
  console.log(child);
}

<div id="list"></div>