js for 循环中的append() 无法正常工作[重复]

Question

我正在学习js，我遇到了append()的问题 在 for 循环中使用追加时，仅对最后一项执行追加方法

let item = document.getElementsByClassName("item");
let delIcon = document.createElement('a')
delIcon.innerHTML = 'del'
for (let i = 0; i < item.length; i++) {
  let newItem = item[i].append(delIcon)
  console.log(newItem);
}

<ul>
  <li class="item">1</li>
  <li class="item">2</li>
  <li class="item">3</li>
  <li class="item">4</li>
</ul>

结果是：

1
2
3
4del

为什么append()只适用于最后一个元素？

Answer 1

您只创建一个

a

元素，因此它只附加一个。您需要在每个循环中创建

a

元素。 这可能对你有用

let item = document.getElementsByClassName("item");
for(let i = 0;i<item.length;i++){
  let delIcon = document.createElement('a')
  delIcon.innerHTML = 'del'
  let newItem = item[i].append(delIcon)
  console.log(newItem);
}

结果是：

1del
2del
3del
4del