Javascript 我的列表项不会在单击按钮时被删除

我的css包含。完成了strike through的文本装饰样式

---

当点击“完成”按钮时，我希望我的列表项被删除。当我单击时，除了“完成”按钮正在按预期更改颜色外，什么也没有发生。

我对您的代码进行了一些重构。为了删除线，您可以使用内置的css函数文本装饰和线穿透

//创建删除按钮 const myListofTasks=document.getElementsByTagNameli； const taskLen=myListofTasks.length； var i=0； 对于i=0；我是塔斯克伦；i++{ //附加删除按钮 让deleteBtn=document.createElementbutton； deleteBtn.innerHTML=Remove&9746； deleteBtn.className=byebye； deleteBtn.onclick=deleteItem； myListofTasks[i].appendChilddeleteBtn； //附加完成按钮 让completeBtn=document.createElementbutton； completetbtn.innerHTML=已完成&9733； completetbtn.className=complete； completetbtn.onclick=completeItem； myListofTasks[i].附录C-CompleteTn； } 函数deleteIteme{ var li=e.target.parentElement； var ul=document.getElementByIdmyTasks； ul.removeChildli； } 函数完成项{ var li=e.target.parentElement； var ul=document.getElementByIdmyTasks； e、 target.style.backgroundColor=红色； e、 target.parentElement.style.setPropertytext-decoration，行通过； } 项目1 项目2 项目3 项目4 项目5 项目6 项目7 项目8 项目9

---

我想先看看这些行：button.onclick=highlightItem；button.onclick.删除线；非常感谢你！这起作用了。什么时候使用let或var有什么区别？这就解释了一切：

//Creates a remove button
var myListofTasks  = document.getElementsByTagName("LI");
var i;
for (i = 0; i < myListofTasks.length; i++) {
  var span = document.createElement("SPAN");
  span.innerHTML = "Remove &#9746";
 // var removeTxt = document.createTextNode("Remove &#9746");
  span.className = "byebye";
  //span.appendChild(removeTxt);
  myListofTasks [i].appendChild(span);

  span.onclick = deleteItem;
}

function deleteItem(e) {
   var li = e.target.parentElement;
   var ul = document.getElementById("myTasks");
   ul.removeChild(li);

}



// Creates a completed button
var creatingFinishBtn = document.getElementsByTagName("LI");
var x;
for (x = 0; x < creatingFinishBtn.length; x++) {
  var button = document.createElement("BUTTON");
  button.innerHTML = "Completed &#9733";
  button.className = "complete";
  creatingFinishBtn[x].appendChild(button);


  button.onclick = highlightItem;
button.onclick.strikeThrough;

}
function strikeThrough(){

    var list = document.querySelector('button');
list.addEventListener('click', function(ev) {
  if (ev.target.tagName === 'LI') {
    ev.target.classList.toggle('completed');
  }
}, false);
}


function highlightItem(e) {
   var li = e.target.parentElement;
   var ul = document.getElementById("myTasks");
   e.target.style.backgroundColor ="red";


}