javascript - 在 for 循环中从数组中删除项目的问题

标签 javascript arrays loops

所以我在 for 循环中从数组中删除项目时遇到问题

var div = document.querySelector('div');
var array = [
"iPad",
"iPod",
"iPhone"
];

for (let i = 0; i < array.length; i++) {
  let p = document.createElement('p');
  p.textContent = array[i];
  div.appendChild(p);

  p.onclick = function() {
    array.splice(array.indexOf(this, 1)); 
    this.remove(); 
    console.log(array);
  }

}
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>repl.it</title>
  </head>
  <body>
    
    <div>
      
    </div>
    
  </body>
</html>


所以问题是,当我单击一个项目将其删除时,它不会删除该特定项目。无论我点击哪一个,它都会从底部开始删除(“iPhone”到“iPod”到“iPad”)。

从视觉上看,它删除了正确的一个,但是当我转到控制台时,我可以看到它是从下往上删除的。任何帮助将非常感激。

最佳答案

for (let i = 0; i < array.length; i++) {
  let p = document.createElement('p'),
      a = array[i];
  p.textContent = a;
  div.appendChild(p);

  p.onclick = function() {
    array.splice(array.indexOf(a),1); 
    this.remove(); 
    console.log(array);
  }
}

关于javascript - 在 for 循环中从数组中删除项目的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44964130/

相关文章:

javascript - 无需显式字符串的详尽检查

php - PHP 中表(JSON 数据)中列的总和

c - 陷入无限循环 (C)

javascript - 运行一个循环,然后重置并再次运行

c++ - 在字符串类型崩溃的动态数组中实现删除

c++ - 'do while loop' 的实际应用是什么

php - 每天更换一个DIV之间的内容

JavaScript 类继承 - 填充方法不起作用

javascript - ReactJS变量变化不是渲染元素

字符数组赋值给另一个字符数组