将完成按钮附加到待办事项应用中的新任务

Question

我试图构建一个待办事项应用程序。我的代码没有将“完成”按钮附加到新任务上。

编辑：更改代码后，我意识到我想将其存储在LocalStorage中，但是我不知道该怎么做。

var addBtn = document.getElementById("addButton");
var textInput = document.getElementById("textInput");
var mainList =  document.getElementById("mainList");

function addCompleteBtn (newTask){
  let completeBtn = document.createElement("button");
  completeBtn.className="btn btn-success";
  completeBtn.id="completeBtn"
  completeBtn.textContent="Completed";
  newTask.appendChild(completeBtn);
};

addBtn.addEventListener("click", ()=>{
  var newTask = document.createElement("li");
  if(textInput.value === ""){
    alert("Please enter a task");
	}else{       
      newTask.textContent=textInput.value
      newTask.className="task d-flex justify-content-between list-group-item bg-primary mt-2";
      addCompleteBtn(newTask);
      mainList.appendChild(newTask);
      textInput.value="";   
    }
});
mainList.addEventListener("click",(evt)=>{
    if (evt.target.id==="completeBtn") {
       let listItem = evt.target.parentNode
       let mainUl = listItem.parentNode
       mainUl.removeChild(listItem);
	}
});

Answer 1

您要document.createElement而不是createItem