将"完成"按钮附加到待办事项列表应用程序中的新任务

Question

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

edit：更改代码后，我意识到我想把它存储在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