JavaScript 在固定时间后调用函数

为了在固定时间间隔后多次运行一个函数，我们使用了几个函数。

JavaScript setInterval() 方法： 这个方法按照指定的时间间隔（以毫秒为单位）调用一个函数。该方法将连续调用该函数，直到 clearInterval() 被调用或窗口关闭。

语法：

setInterval(fun, msec, p1, p2, ...)

参数：

fun： 这是一个必需参数，它保存要执行的函数。
msec： 这是一个必需参数，表示执行代码之间的时间间隔（以毫秒为单位）。如果该值小于10，则使用10作为默认值。
p1, p2, …： 这是一个可选参数，作为参数传递给函数。（不支持IE9及更早版本）。
JavaScript clearInterval() 方法：

概述： 这个方法用于清除由setInterval()方法设置的定时器。使用由setInterval()方法返回的ID值作为该方法的参数。

语法：

clearInterval(varSetInt)

参数:

varSetInt:是必需的参数。这是由setInterval()方法返回的定时器的名称。

示例1： 此示例设置了一个函数，每2秒钟在元素后连续添加一个div元素。

<body id="body"> 
  
    <h1 style="color:green;"> 
        GeeksForGeeks 
    </h1> 
  
    <p id="GFG_UP" style="color:green;"></p> 
  
  
    <button onclick="gfg_Run()"> 
        Run 
    </button> 
  
    <p id="GFG_DOWN" style="color:green;font-size:20px;"></p> 
  
  
    <script> 
        var el_up = document.getElementById("GFG_UP"); 
        var el_down = document.getElementById("GFG_DOWN"); 
        var el_body = document.getElementById("body"); 
        el_up.innerHTML = JSON.stringify(GFG_object); 
          
        function gfg_Run() {  
            setInterval(function() { 
                var node = document.createElement("DIV");          
                var textnode = document.createTextNode("this is GFG!"); 
                node.appendChild(textnode);  
                el_body.appendChild(node); 
            }, 2000); 
        } 
    </script> 
</body>

输出:

JavaScript 在固定时间后调用函数

示例2： 这个示例设置一个函数，每隔2秒钟在<body>中不断添加一个<div>元素，并在点击停止按钮后停止添加。

<body id="body"> 
  
    <h1 style="color:green;"> 
        GeeksForGeeks 
    </h1> 
  
    <p id="GFG_UP" style="color:green;"></p> 
    <button onclick="gfg_Run()"> 
        Run 
    </button> 
  
    <button onclick="gfg_Stop()"> 
        Stop 
    </button> 
  
    <p id="GFG_DOWN" style="color:green;font-size:20px;"></p> 
    <script> 
        var el_up = document.getElementById("GFG_UP"); 
        var el_down = document.getElementById("GFG_DOWN"); 
        var el_body = document.getElementById("body"); 
        el_up.innerHTML = JSON.stringify(GFG_object); 
        var timer; 
        function gfg_Run() {  
            timer = setInterval(function() { 
                var node = document.createElement("DIV");          
                var textnode = document.createTextNode("this is GFG!"); 
                node.appendChild(textnode);  
                el_body.appendChild(node); 
            }, 2000); 
        } 
        function gfg_Stop() { 
            clearInterval(timer); 
          
        } 
    </script> 
</body>

输出：

JavaScript 在固定时间后调用函数

示例3： 这个示例设置了一个函数，在1秒后以不同的方式持续将<div>元素附加到<body>上，并在单击停止按钮时停止附加。

<body id="body"> 
  
    <h1 style="color:green;"> 
        GeeksForGeeks 
    </h1> 
  
    <p id="GFG_UP" style="color:green;"></p> 
  
  
    <button onclick="gfg_Run()"> 
        Run 
    </button> 
  
    <button onclick="gfg_Stop()"> 
        Stop 
    </button> 
  
    <p id="GFG_DOWN" style="color:green;font-size:20px;"></p> 
  
  
    <script> 
        var el_up = document.getElementById("GFG_UP"); 
        var el_down = document.getElementById("GFG_DOWN"); 
        var el_body = document.getElementById("body"); 
        el_up.innerHTML = JSON.stringify(GFG_object); 
        var timer; 
          
        function gfg_Run() {  
            function gfg_function() { 
                var node = document.createElement("DIV");          
                var textnode = document.createTextNode("this is GFG!"); 
                node.appendChild(textnode);  
                el_body.appendChild(node); 
            } 
            timer = setInterval(gfg_function, 1000); 
        } 
        function gfg_Stop() { 
            clearInterval(timer); 
          
        } 
    </script> 
</body>

输出：

JavaScript 在固定时间后调用函数