js 定時器用法詳解——setTimeout()、setInterval()、clearTimeout()、clearInterval()

標籤：nbsp   exp   asc   詳解   string   settime   doc   user   運算式   

 

在js應用中，定時器的作用就是可以設定當到達一個時間來執行一個函數，或者每隔幾秒重複執行某段函數。這裡面涉及到了三個函數方法：setInterval()、setTimeout()、clearInterval()，本文將圍繞這三種函數的用法，來實現定時器的功能，需要的朋友可以過來參考下，喜歡的可以點波贊，或者關注一下本人，希望對大家有所協助。

定時器的應用需求：

1.設定一個時間，當時間到達的時候執行函數————比如：倒計時跳轉頁面等等。

2.每隔一段時間重複執行某段函數————比如搶票軟體，比如設定500毫秒就重複重新整理一次頁面等等。

js定時器：

菜鳥教程中是這麼說的——js 定時器有以下兩個方法：

setTimeout() ：在指定的毫秒數後調用函數或計算運算式。

setInterval() ：按照指定的周期（以毫秒計）來調用函數或計算運算式。方法會不停地調用函數，直到 clearInterval() 被調用或視窗被關閉。

使用文法：

setTimeout（）：setTimeout(code,millisec)

setInterval（）：setInterval(code,millisec[,"lang"])

參數：code————要進行調用的函數或者要執行的代碼串。millisec————時間（預設毫秒來計算），lang————可選。 JScript | VBScript | JavaScript（）

然而setTimeout()、setInterval()的區別在於

setTimeout()：當方法執行完成定時器就立即停止(但是定時器還在,只不過沒用了);

setInterval()：當方法執行完成,定時器並沒有停止,以後每隔[interval]這麼長的時間都會重新的執行對應的方法[function],直到我們手動清除定時器為止;

意思就是：

setTimeout()時間到了只會執行一次，setInterval()不會停止，會不間斷的執行對應的函數，直到我們手動暫停或視窗被關閉。

倒計時跳轉demo講解： 

    <div class="time">請等待<span id="dd">5</span>秒</div>//js部分：function run(){            var s = document.getElementById("dd");            if(s.innerHTML == 0){                window.location.href = "https://juejin.im/user/58714f0eb123db4a2eb95372/article";                clearInterval(run());            }            s.innerHTML = s.innerHTML -1;        }        window.setInterval("run();", 1000);     

js 定時器用法詳解——setTimeout()、setInterval()、clearTimeout()、clearInterval()