Uncaught Impossible d'exécuter 'removeChild' sur 'Node': le paramètre 1 n'est pas de type 'Node'

Question

Je suis assez nouveau pour manipuler le DOM en JavaScript et essayer de faire une liste de tâches qui ajoute un élément de liste en utilisant le valeur de texte de l'entrée et supprime l'élément de liste lorsque je clique sur l'élément de liste. J'ai vu qu'il y a plusieurs façons et aussi des façons plus courtes de le faire mais j'essaye de le faire de la manière la plus simple pour être plus à l'aise pour manipuler des éléments dans le DOM.

Lorsque je clique sur un élément de liste, j'obtiens l'erreur "Echec de l'exécution de 'removeChild' sur 'Node': le paramètre 1 n'est pas de type 'Node'." dans la console Qui de la documentation j'obtiendrais cette erreur si "l'enfant n'existe pas sur le DOM de la page"

Mais d'après ce que je comprends, mon li existe sur le DOM de la page.

Quelqu'un peut-il m'expliquer s'il vous plaît comme je suis 5, très simplement et moins le jargon comment je vais mal et pourquoi je reçois cette erreur?

S'il vous plaît noter que j'ai essayé des réponses à des questions sur des problèmes similaires affichés sur la pile: par exemple. en utilisant removeChild le «bon» moyen

taskList.removeChild(document.querySelectorAll("li")); 

mais je ne pense pas que ce soit le problème?

également vouloir résoudre ce avec plaine/js de vanille Seulement

Merci à l'avance

HTML

<ul id="taskList"> 
    <li>example</li> 
</ul> 
<input type="text" id="addTaskInput"> 
<button id="addTaskButton">Add Task</button> 

JavaScript

const taskList = document.querySelector("#taskList"); 
const addTaskInput = document.querySelector("#addTaskInput"); 
const addTaskButton = document.querySelector("#addTaskButton"); 
let taskItem = document.querySelectorAll("li"); 


addTaskButton.addEventListener("click",() => { 
let taskItem = document.createElement("li"); 
taskItem.textContent = addTaskInput.value; 
taskList.appendChild(taskItem); 
addTaskInput.value = " "; 
}); 

for (let i = 0; i < taskItem.length; i++) { 
taskItem[i].addEventListener("click",() => { 
taskList.removeChild(taskItem); 
}); 
} 

Answer 1

Depuis removeChild attend un nœud, peut-être vous voulez seulement l'article actuel:

for (let i = 0; i < taskItem.length; i++) { 
    taskItem[i].addEventListener("click",() => { 
     taskList.removeChild(taskItem[i]); 
    }); 
}