未捕获无法执行'节点'上的'removeChild'：参数1不是'节点'类型

我很新操作JavaScript中的DOM并试图做一个列表项，使用输入的文本值，并在单击列表项时删除列表项。我看到有几种方法，也有更短的方法来做到这一点，但我试图用最简单的方法来操作DOM中的元素。未捕获无法执行'节点'上的'removeChild'：参数1不是'节点'类型

当我点击一个列表项目时，出现错误“Node'上的'removeChild'执行失败：参数1不是'Node'类型。在控制台从文档中我会得到这个错误，如果“孩子不存在于页面的DOM上”

但是从我所了解的我的li确实存在于页面的DOM上。

有人可以请我解释一下，就像我5，很简单，减去行话我怎么会出错，为什么我得到这个错误？

请注意，我已经尝试了解栈上发布的类似问题的问题的答案：例如，使用removeChild“适当”的方式

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

但我不认为这是问题吗？

也想用普通来解决这一/香草JS只能请

预先感谢您

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); 
}); 
}

来源

2017-09-04 Jessica

如果您试图用'querySelectorAll'调用'removeChild'，那么您会遇到问题。 'querySelectorAll'返回一个列表，但'removeChild'需要一个节点。 – jmargolisvt

由于removeChild之需要一个节点，也许你只想要当前的项目：

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

来源

2017-09-04 03:44:40 Nick

未捕获无法执行'节点'上的'removeChild'：参数1不是'节点'类型

回答

相关问题