我的任务是创建一个待办事项列表表单。用户应该能够输入他们的“待办事项”，然后显示这些待办事项。用户可以选择删除和删除每个待办事项。当用户刷新页面时，本地存储应显示用户输入的待办事项。
我可以在第一次尝试时返回保存在本地存储中的所有输入。但是，一旦我清除了控制台，我就意识到我的输入不再保存到本地存储中。每次我插入一个输入-输入不保存到本地存储中。enter image description here。
附件是显示浏览器。
很抱歉代码写得太马虎了。我刚刚开始学习代码。如有任何帮助将不胜感激！

const form = document.querySelector("form");
// const li = document.querySelector("li");
const ul = document.querySelector("#todolist");
const input = document.querySelector("#TO-DO");
let todoArray;

if (localStorage.todos) {
  todoArray = JSON.parse(localStorage.todos);
} else {
  todoArray = [];
}

for (let todo of todoArray) {
  addTodo(todo);
}

function addTodo(userInput) {
  const newToDo = document.createElement("li");

  newToDo.innerText = userInput;
  ul.appendChild(newToDo);
  newToDo.addEventListener("click", function (e) {
    if (e.target.tagName === "LI") {
      newToDo.classList.toggle("completed");
    }
  });
  const removeBtn = document.createElement("button");
  removeBtn.innerText = "REMOVE";
  removeBtn.addEventListener("click", function () {
    removeBtn.parentElement.remove();
    removeFromLocalStorage(userInput);
  });
  newToDo.prepend(removeBtn);
}

const userInput = input.value;

ul.addEventListener("click", function (e) {
  
  if (e.target.tagName === "BUTTON") {
    e.target.parentElement.remove();
  } else if (e.target.tagName === "LI") {
  }
});

form.addEventListener("submit", function submit(e) {
  e.preventDefault();

  const newToDo = document.createElement("li");
  const removeBtn = document.createElement("button");
  const userInput = input.value;
  

  removeBtn.innerText = "REMOVE";
  removeBtn.addEventListener("click", function () {
    removeBtn.parentElement.remove();
  });

  newToDo.innerText = userInput;
  input.value =
    ""; /* resetting the input value to be empty after we retieve value */
  ul.append(newToDo);
  newToDo.appendChild(removeBtn);
  newToDo.addEventListener("click", function (e) {
    if (e.target.tagName === "LI") {
      //   console.log("YOU CLICKed lI");
      newToDo.classList.toggle("completed");
    }
  });
});

function addToLocalStorage(userInput) {
  todoArray.push(userInput);
  localStorage.setItem("todos", JSON.stringify(todoArray));
}

function removeFromLocalStorage(userInput) {
  for (let i = 0; i < todoArray.length; i++) {
    if (todoArray[i] === userInput) {
      todoArray.splice(i, 1);
      break;
    }
  }
  localStorage.setItem("todos", JSON.stringify(todoArray));
}