如何在 Javascript 事件处理程序中延迟向 DOM 添加元素

How to delay addition of elements to the DOM in Javascript event handler

本文关键字：延迟 DOM 添加 元素 程序 Javascript 事件处理      更新时间：2023-09-26

我使用纯JavaScript没有库，我对客户端编程，尤其是JavaScript很陌生。

我的客户端窗口被分隔为左侧和右侧。

在用户按下按钮完成任务事件处理程序的某个时刻被触发。

事件处理程序添加两个 HTML 元素，一个在窗口的左侧，另一个在窗口的右侧，延迟约为 3000 毫秒。

下面是事件处理程序的概念说明： 

        function completeTask() 
        {
            addSomeElemntToLeftSide(); 
            delay(3000);
            addSomeElemntToRightSide();
        }

问题是在事件处理程序执行后，这两个 HTML 元素都已添加到 DOM 中，没有任何延迟。

知道我应该怎么做才能在向左添加两个元素和在 3000 毫秒之后

延迟吗？

Javascript 没有delay()函数。对于这样的事情，你会想要使用 setTimeout ，如下所示：

function completeTask() {
    addSomeElemntToLeftSide(); 
    setTimeout(addSomeElemntToRightSide, 3000);
}

addSomeElemntToRightSide函数被传递给setTimeout，它将在3000ms(3秒(内运行它。你也可以这样写：

function completeTask() {
    addSomeElemntToLeftSide(); 
    setTimeout(function () {
        addSomeElemntToRightSide();
    }, 3000);
}
您可以使用

setTimeout()：

setTimeout(addSomeElemntToRightSide, 3000);

第二个参数是您希望等待的时间(以毫秒为单位(。

简单...

function completeTask() 
        {
            setTimeout(addSomeElemntToLeftSide,3000); 
            setTimeout(addSomeElemntToRightSide,3000);
        }

如果您只想在两个调用之间出现延迟，请仅在第二次调用中使用 setTimeout...

相关文章：