我的删除 html 元素的函数有问题。（第一次发帖，请多多关照）

Question

我是一名初级程序员，我正在从事我的第一个小项目。我决定做一个笔记应用程序。它基本上完成了，只是我想要一个按钮来删除所有已完成的任务，但我遇到了问题。基本上，它在 localStorage 上工作，我将任务名称存储为键，值为 0（未完成）或 1（已完成）。在最后一个函数中，我想删除 localStorage 值为 1 的所有任务。这是我的代码。一旦我运行它，我在删除所有 li 元素时遇到问题。有些被删除，有些没有。在控制台中，我看到两个未声明 tableChild 的错误。好像很奇怪。

    document.querySelector(".btn-delete-completed").addEventListener("click", function () {
    let children = listOfTasks.children; /*takes an ul element (listOfTasks) and selects its child elements*/
    let arrayLenght = children.length; /*variable to see the lenght of the created arrray*/
    let tableChild = 0; /*creates a variable that will be redeclared in the loop dynamically*/
    for (let i = 0; i < arrayLenght; i++) { /*for loop that takes a stative arrayLenght instead of dynamic one(since we will be deleting elements)*/
      tableChild = children[i]; /*redeclares a tableChild variable to a single li with the text that is a key to localStorage*/
      if (localStorage.getItem(tableChild.textContent) == 1) {/*Checks for the value in localStorage, getItem() uses the key that is text of the selected element*/
        tableChild.remove();/*removes the element from html*/
        localStorage.removeItem(tableChild.textContent); /*removes element from localStorage*/
      }
    }
  });

在这里。我希望文档足够好。正如我所说，我只是一个初学者，我 post 第一次来这里。如果您有任何问题，我很乐意在评论中回答！再次抱歉，如果我在 post.

中搞砸了什么

提前致谢！

Answer 1

当您从数组中删除元素时，它的长度会发生变化。您的代码中没有考虑到这一点。

我发现在这种情况下向后迭代最简单：

for (let i = children.length - 1; i >= 0; i--){
//...

我的删除 html 元素的函数有问题。（第一次发帖，请多多关照）

I am having problems with a my function to delete html elements. (First time posting, please be nice)

javascript

for-loop

local-storage

我的删除 html 元素的函数有问题。 （第一次发帖，请多多关照）

I am having problems with a my function to delete html elements. (First time posting, please be nice)

javascript

for-loop

local-storage

我的删除 html 元素的函数有问题。（第一次发帖，请多多关照）