JavaScript | clearTimeout() & clearInterval() 方法

JavaScript | clearTimeout() & clearInterval() 方法

先决条件：setTimeout() 和 setInterval()

清除超时（）
javascript 中的 clearTimeout()函数清除之前由setTimeout()函数设置的超时。

• setTimeout()函数有两个参数。首先是要执行的函数，其次是多少时间（以毫秒为单位）。
• setTimeout()在给定时间后执行传递的函数。 setTimeout()函数返回的数字 id 值存储在一个变量中，并传递给clearTimeout()函数以清除计时器。

例子：

  

    
        HTML | DOM Windows clearTimeout() method
    

  

  
    
        GeeksForGeeks
    Stop
    
        var t;
  
        function color() {
            if (document.getElementById('btn').style.color == 'blue') {
                document.getElementById('btn').style.color = 'green';
            } else {
                document.getElementById('btn').style.color = 'blue';
            }
  
        }
  
        function fun() {
            t = setTimeout(color, 3000);
  
        }
  
        function stop() {
            clearTimeout(t);
        }
    

  

解释：
GeeksForGeeks 按钮颜色会在 3 秒后更改一次。单击 GeeksForGeeks 按钮后 3 秒前单击停止以清除超时。

清除间隔（）
javascript 中的 clearInterval()函数清除之前由setInterval()函数设置的时间间隔。

• setInterval()函数有两个参数。首先是要执行的函数，其次是多少时间（以毫秒为单位）。
• setInterval()在给定的时间间隔内执行传递的函数。 setInterval()函数返回的数字 id 值存储在一个变量中，并传递给clearInterval()函数以清除间隔。

例子：

  

    
        HTML | DOM Windows clearInterval() method
    

  

    
        GeeksForGeeks
    Stop
    
        var t;
  
        function color() {
            if (document.getElementById('btn').style.color == 'blue') {
                document.getElementById('btn').style.color = 'green';
            } else {
                document.getElementById('btn').style.color = 'blue';
            }
  
        }
  
        function fun() {
            t = setInterval(color, 3000);
  
        }
  
        function stop() {
            clearInterval(t);
        }
    

  

解释：
在此示例中，GeeksForGeeks 颜色每 3 秒更改一次并保持不变，之后再次更改。单击停止以清除间隔。

支持的浏览器： clearTimeout() & clearInterval() 方法支持的浏览器如下：

• 谷歌浏览器 1.0
• 互联网浏览器 4.0
• 火狐1.0
• 歌剧 4.0
• Safari 1.0