javascript - 从数组javascript中删除

标签 javascript

我正在遍历一个数组并将其显示在屏幕上。不过我有个问题。我试图添加一个功能,当你点击文本时,它会删除点击的文本。这是我的代码:

var div = document.querySelector('div');
var array = [
"Banana",
"Chocolate",
"Oranges"
];

for(let i = 0; i < array.length; i++){

var p = document.createElement('p');
p.textContent = array[i];
div.appendChild(p);

p.onclick = function(){

    array.splice(array[i], 1);
    console.log(array);
}

}

当我点击它时,它会从数组中删除项目并将其记录到控制台。但它没有显示在屏幕上。有帮助吗?

谢谢, 抓挠猫

最佳答案

你看起来很亲近。您已经从数组中删除了元素,但没有从 DOM 中删除,这就是为什么您在 html 中看不到更新的原因。

for(let i = 0; i < array.length; i++){
var p = document.createElement('p');//note the block scoping
p.textContent = array[i];
div.appendChild(p);

p.onclick = function(){
    array.splice(i, 1);
    this.remove();//also remove from the DOM
    console.log(array);
}

}

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

相关文章:

javascript - 使用 javascript 加载 css 文件(通过使用 @import 而不是通过链接)

javascript - 如何使用 moment.js 从我的日期中删除年份?

javascript - 将字符串转换为数组后,我得到错误的数组长度

javascript - React Native 中的循环运动动画

javascript - 将 JS 文件导入 Typescript

javascript - ASP.NET Razor 页面中出现未终止的字符串常量错误

javascript - 如何通过 ssh2 Node.js 模块(在 Electron 应用程序内)使用 SFTP 一次下载/上传多个文件?

javascript - 插入使用 ng-click 的动态模板

javascript - 检测 jQuery 旋钮值

javascript - 上传 Javascript 后获取图像宽度 [适用于 Firefox,但不适用于 chrome]