Javascript 我能'；t make按钮将类添加到新创建的<；李>；要素

我在试着列一个简单的待办事项清单。我已成功创建了按钮，但无法使其在单击时删除项目。控制台上显示：

李没有定义

let getText=document.querySelector（“.text”）；
让getUl=document.querySelector（“.list”）；
让dBtn=document.createElement（“按钮”）；
函数addItem（）{
让newLi=document.createElement（“li”）；
newLi.innerHTML=getText.value；
新立儿童（dBtn）；
格图尔·查德（纽利）；
getText.value=“”；
}
appendChild（document.createTextNode（“X”））；
dBtn.addEventListener（“单击”，函数（）{
li.类列表。添加（“删除”）；
})

*{
填充：0；
保证金：0；
文本对齐：居中；
}
.按钮添加{
高度：19px；
宽度：40px；
边界半径：5px；
}
.删除{
显示：无；
}
.文本{
边界半径：5px；
}

待办事项清单 添加

---

在

li

中添加类

delete

不会在单击时删除该项

当前代码仅将按钮添加到创建的第一个

li

。我相信您希望为每个

li

添加按钮。如果是这样，您必须在创建

li

时添加按钮功能

将单击处理程序功能代码替换为：

this.parentNode.remove();

这将删除当前的

li

let getText=document.querySelector（“.text”）；
让getUl=document.querySelector（“.list”）；
函数附加项（）{
让newLi=document.createElement（“li”）；
让dBtn=document.createElement（“按钮”）；
dBtn.addEventListener（“单击”，删除）；
newLi.innerHTML=getText.value；
appendChild（document.createTextNode（“X”））；
新立儿童（dBtn）；
格图尔·查德（纽利）；
getText.value=“”；
}
函数removeLi（）{
this.parentNode.remove（）；
}

*{
填充：0；
保证金：0；
文本对齐：居中；
}
.按钮添加{
高度：19px；
宽度：40px；
边界半径：5px；
}
.删除{
显示：无；
}
.文本{
边界半径：5px；
}

待办事项清单
添加

因为没有定义addItem（）。您将在元素之后声明它

尝试从按钮e中删除onclick=“”，并在js中给它一个onclick

替换

函数addItem（）{..}

如下：

document.getElementsByClassName('button-add')[0].onclick = function (){
  let newLi = document.createElement("li");
  newLi.innerHTML=getText.value;
  newLi.appendChild(dBtn);
  getUl.appendChild(newLi);
  getText.value="";
}

删除

dBtn.addEventListener("click",function ()  {
  this.parentNode.classList.add("delete");
})

---

您在代码中在哪里定义了“li”？仍然不想删除新创建的list@Frozendawn，它在哪里不工作？在这个答案中，或者在您的实际代码中？？非常感谢，它使它成为了我想要的样子。我只是想编辑最后一部分，我想知道为什么它不是working@Frozendawn，非常欢迎。问题是，

li

没有引用元素，因为您没有像对其他变量那样定义它。然后，由于按钮位于

li

中，因此需要创建按钮并将单击事件作为每个

li

的一部分附加。因此，您应该将该功能放在

addItem（）

中…………谢谢。显然，现在“X”总是在最后一个li上。如果你需要解决这个问题，我们可以这样做：）谢谢，这起作用了，我只需要弄清楚如何把x放在每个新的LIP旁边，然后在onclick函数

let getText=document.querySelector（“.text”）中使用逻辑；让getUl=document.querySelector（“.list”）；document.getElementsByClassName（'button-add'）[0]。onclick=function（）{let newLi=document.createElement（“li”）；let dBtn=document.createElement（“button”）；newLi.innerHTML=getText.value；newLi.appendChild（dBtn）；getText.value=“”；dBtn.appendChild（document.createTextNode（“X”）；dBtn.addEventListener(“单击”，函数（）{this.parentNode.classList.add（“delete”）；}