配列のjavascriptから削除する

Question

私は配列をループして画面に表示しています。しかし、私は問題があります。私は、テキストをクリックするとそのクリックされたテキストを削除する機能を追加しようとしました。私のコードは以下の通りです：

私がクリックすると、アレイから項目を削除してコンソールに記録します。しかし、それは画面に表示されません。どんな助け？

あなたはまた、HTML要素を削除することがあり、 スクラッチ猫

Answer 1

あなたが行く：

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

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

    p.onclick = function() { 
    array.splice(array.indexOf(this), 1); //splice wants an index... 
    this.remove(); //remove el from document tree 
    console.log(array); 
    } 

} 

https://jsfiddle.net/wt0fux3f/6/

Answer 2

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

p.onclick = function(){ 
    array.splice(i, 1);//splice wants an index... 
    p.remove();//remove el from document tree 
    console.log(array); 
} 

} 

をいただき、ありがとうございますか！ここで

Answer 3

あなたが近いように見えます。配列から要素を削除しましたが、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); 
} 

}