配列に格納された値を追加しようとしたときにappendChild（）が失敗する

Question

次のコードは、saved変数内にリストされているこれらの要素以外の特定の要素の子をすべて削除します。

let rightCol = document.querySelector("#rightCol"); 
let saved = rightCol.querySelectorAll('._4-u2._3-96._4-u8'); 
let savedArr = []; 

saved.forEach(()=>{ 
    savedArr.push(saved); 
}); 

rightCol.innerHTML = ''; // Delete all children before retrieving "saved" ones. 

for (var i = 0; i < savedArr.length; i++) { 
    rightCol.appendChild(savedArr[i]); 
}; 

コードは、このエラーで失敗します。

TypeError: Argument 1 of Node.appendChild does not implement interface Node.

コードが失敗したのはなぜ？

Answer 1

あなたが提示したコードは、2個のエラーを持っている：

• querySelectorAllは、文書上で実行する必要があります。
• ループごとに配列全体をプッシュしています。ここ

作業コピー

let rightCol = document.querySelector("#rightCol"); 
let saved = document.querySelectorAll('._4-u2._3-96._4-u8'); 
let savedArr = []; 

saved.forEach((s)=> { 
    savedArr.push(s); 
}); 

rightCol.innerHTML = ''; // Delete all children before retrieving "saved" ones. 

for (var i = 0; i < savedArr.length; i++) { 
    rightCol.appendChild(savedArr[i]); 
}; 

です

Answer 2

あなたは次の行の要素

あなたのコードの状態.each（（）=>の代わりに、あなたの選択の見返りに、各要素のためのあなたのコレクションの配列を推進している、プッシュする引数がなければなりません this

forEachの各反復で

Answer 3

あなたはsavedArrに全体saved配列を追加している。あなたが代わりにforEachコールバックに渡されたパラメータを使用して、各項目を追加する必要があります。

例えば

saved.forEach((s)=> { 
    savedArr.push(s); 
}); 

あなたがここにかかわらず、別の配列に上の配列をコピーしている理由はわからない。..