快捷導航

Javascript中setTimeOut和setInterval的定時器用法

更新時間：2015年06月12日 11:36:03 投稿：hebedich

這篇文章主要介紹了Javascript中setTimeOut和setInterval的定時器用法的相關(guān)資料,需要的朋友可以參考下

Javascript的setTimeOut和setInterval函數(shù)應(yīng)用非常廣泛，它們都用來處理延時和定時任務(wù)，比如打開網(wǎng)頁一段時間后彈出一個登錄框，頁面每隔一段時間發(fā)送異步請求獲取最新數(shù)據(jù)等等。但它們的應(yīng)用是有區(qū)別的。

setTimeout() 方法用于在指定的毫秒數(shù)后調(diào)用函數(shù)或計算表達式,而setInterval()則是在每隔指定的毫秒數(shù)循環(huán)調(diào)用函數(shù)或表達式，直到clearInterval把它清除。也就是說setTimeout()只執(zhí)行一次，setInterval()可以執(zhí)行多次。兩個函數(shù)的參數(shù)也相同，第一個參數(shù)是要執(zhí)行的code或句柄，第二個是延遲的毫秒數(shù)。
setTimeOut用法
setTimeout函數(shù)的用法如下：

復制代碼代碼如下:

var timeoutID = window.setTimeout(func, [delay, param1, param2, ...]); 

var timeoutID = window.setTimeout(code, [delay]); 

timeoutID：定時器ID號，它可以在clearTimeout()函數(shù)中被用來清除定時器。
func：被執(zhí)行的函數(shù)。
code：（替代的語法）一個被執(zhí)行的代碼串。
delay：延遲的時間，單位毫秒。如果沒有指定，默認為0。

我們可以使用window.setTimeout或setTimeout，兩個寫法基本一樣，只不過window.setTimeout將setTimeout函數(shù)作為全局window對象的一個屬性來引用。

應(yīng)用示例：

復制代碼代碼如下:

function timeout(){ 

    document.getElementById('res').innerHTML=Math.floor(Math.random()*100 + 1); 

} 

setTimeout("timeout()",5000);

代碼執(zhí)行時，5秒后調(diào)用timeout()函數(shù)，點擊看演示。
setInterval用法
setInterval函數(shù)的參數(shù)及用法和setTimeout函數(shù)一樣，請參照上文的setTimeout函數(shù)的用法介紹。不同的是，setInterval每隔一定的時間執(zhí)行當中的func或code代碼。
應(yīng)用示例：

復制代碼代碼如下:

var tt = 10; 

function timego(){ 

    tt--; 

    document.getElementById("tt").innerHTML = tt; 

    if(tt==0){  

        window.location.href='/'; 

        return false; 

    } 

} 

var timer = window.setInterval("timego()",1000);

函數(shù)timego()定義了頁面元素#tt顯示的內(nèi)容，當tt等于0時，頁面定向到首頁。然后我們定義一個定時器timer，使用setInterval()每隔1秒調(diào)用一次timego()。這樣timego會執(zhí)行10次，每次數(shù)字tt會減1，直到為0。那么如果想停止定時器，可以使用以下代碼：

復制代碼代碼如下:

window.clearInterval(timer);

代碼執(zhí)行時，10秒后頁面跳轉(zhuǎn)到首頁

其實setTimeout()也可以實現(xiàn)每隔一段時間重復執(zhí)行某個函數(shù)，但我們還是簡單的區(qū)別使用setTimeOut和setInterval。另外javascript都是以單線程的方式運行于瀏覽器的javascript引擎中，實際應(yīng)用中復雜的任務(wù)中需要排隊執(zhí)行，這就可能導致定時器時間不準，這個問題在大型應(yīng)用中需要考慮，本文不做深究。

以上所述就是本文的全部內(nèi)容了，希望大家能夠喜歡。

您可能感興趣的文章: