JavaScript 删除功能

问题描述

我在 JavaScript 中有这样一个函数。使用它我想以一定的时间间隔删除 ol 中的 li 元素，但它实际上不起作用。

function Delete(){
    var node = document.getElementById("parent");
    let i = 1;
    
    while(node.firstChild){
        setInterval(function() {
        node.removeChild(node.lastChild);
        },200);
    }
}

请问有什么问题吗？？？

解决方法

您使用 while 循环进行了无限循环。同样 setInterval 做的完全不同，但是 setInterval 和 setTimeout 将在下一个 event loop 中执行，因此 node.firstChild 将始终是两种情况都一样。

您想这样做：

    var node = document.getElementById("parent");
    let i = 0;
    
    for(const li of node.childNodes)
    {
        setTimeout(function() {
            node.removeChild(node.lastChild);
        },300 * i++); // I suppose you wanted to do this with the i 
    }

您使用的设置间隔有问题从未说明何时清除间隔，而您的 while 只是无用，因为 while 循环终止设置间隔每 200 毫秒后运行一次，它将无限继续所以我认为这对你有用

    function Delete() {
    var node = document.getElementById("parent");
    let i = 1;
    
    if(node.firstChild){
        let interval =setInterval(function() {
          if(node.lastChild)
              node.removeChild(node.lastChild);
          else
              clearInterval(interval);
        },200);
    }

}

html-lists javascript setinterval