千鋒教育JavaScript全套視頻教程(10天學(xué)會(huì)Js,前端javascrip

定時(shí)器
一、 setTimeout() 定時(shí)器
語(yǔ)法:
window.setTimeout(調(diào)用函數(shù), [延遲的毫秒數(shù)]);
setTimeout()方法用于設(shè)置一個(gè)定時(shí)器,該定時(shí)器在定時(shí)器到期后執(zhí)行調(diào)用函數(shù)。
例如:寫(xiě)一個(gè)頁(yè)面,讓其五秒鐘后彈出‘你好’。
代碼如下:
window.setTimeout(function(){
??????alert('你好');
????},5000);
需要注意的是:
window 可以省略。
這個(gè)調(diào)用函數(shù)可以直接寫(xiě)函數(shù),或者寫(xiě)函數(shù)名或者采取字符串‘函數(shù)名()'三種形式。
延遲的毫秒數(shù)省略默認(rèn)是 0,如果寫(xiě),必須是毫秒。
setTimeout() 這個(gè)調(diào)用函數(shù)我們也稱為回調(diào)函數(shù)callback,普通函數(shù)是按照代碼順序直接調(diào)用。而這個(gè)函數(shù),需要等待時(shí)間,時(shí)間到了才去調(diào)用這個(gè)函數(shù),因此稱為回調(diào)函數(shù)。
二、停止 setTimeout() 定時(shí)器
????當(dāng)我們創(chuàng)建了一個(gè)定時(shí)器的話,如果我們想要將其取消,應(yīng)該怎樣操作呢?就用到了清除定時(shí)器的函數(shù),如下:
window.clearTimeout(timeoutID)
?clearTimeout()方法取消了先前通過(guò)調(diào)用 setTimeout()建立的定時(shí)器。
這里面window 可以省略,并且里面的參數(shù)就是定時(shí)器的標(biāo)識(shí)符 。
????舉個(gè)例子:
????就上述案列,如果我們想要在指定事件前停止它,可以先添加一個(gè)點(diǎn)擊按鈕,給這個(gè)按鈕添加清除定時(shí)器的事件,操作為:
?var hello = window.setTimeout(function(){
??????alert('你好');
????},5000);
????var btn = document.querySelector('button');
????btn.addEventListener('click',function(){
??????window.clearTimeout(hello);
????})
三、setInterval() 定時(shí)器
????我們?cè)賮?lái)看看另一種定時(shí)器。
window.setInterval(回調(diào)函數(shù), [間隔的毫秒數(shù)]);
????setInterval()方法重復(fù)調(diào)用一個(gè)函數(shù),每隔這個(gè)時(shí)間,就去調(diào)用一次回調(diào)函數(shù)。
window 可以省略。
這個(gè)調(diào)用函數(shù)可以直接寫(xiě)函數(shù),或者寫(xiě)函數(shù)名或者采取字符串 ‘函數(shù)名()’ 三種形式。
間隔的毫秒數(shù)省略默認(rèn)是 0,如果寫(xiě),必須是毫秒,表示每隔多少毫秒就自動(dòng)調(diào)用這個(gè)函數(shù)。
4.我們經(jīng)常給定時(shí)器賦值一個(gè)標(biāo)識(shí)符。
第一次執(zhí)行也是間隔毫秒數(shù)之后執(zhí)行,之后每隔毫秒數(shù)就執(zhí)行一次。