快捷導(dǎo)航

Javascript中setTimeOut和setInterval的定時(shí)器用法

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

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

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

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

復(fù)制代碼代碼如下:

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

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

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

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

應(yīng)用示例：

復(fù)制代碼代碼如下:

function timeout(){ 

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

} 

setTimeout("timeout()",5000);

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

復(fù)制代碼代碼如下:

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

復(fù)制代碼代碼如下:

window.clearInterval(timer);

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

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

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

您可能感興趣的文章: