在Web開發(fā)中,我們經(jīng)常會用到JavaScript來實現(xiàn)一些動態(tài)效果,而設(shè)置定時器也是其中一個重要的技能。設(shè)置定時器可以讓我們在一段時間后自動執(zhí)行某些任務(wù)或者周期性的執(zhí)行某些任務(wù)。在本文中,我們將來介紹如何使用JavaScript設(shè)置定時器。
使用setTimeout設(shè)置定時器
setTimeout()是設(shè)定一個定時器,指定一個時延時間后執(zhí)行一個函數(shù)。其基本語法為:
其中,function為要執(zhí)行的函數(shù),milliseconds為時延時間(以毫秒為單位)。
例如,下面的代碼會在頁面打開2秒鐘后彈出一個提示框:
如果要取消定時器,可以使用clearTimeout()函數(shù)。例如:
使用setInterval設(shè)置定時器
setInterval()也是設(shè)定一個定時器,但是它會周期性地執(zhí)行一個函數(shù)。它的基本語法為:
其中,function為要執(zhí)行的函數(shù),milliseconds為周期性時間間隔(以毫秒為單位)。
例如,下面的代碼會每隔1秒鐘輸出一次當(dāng)前時間:
如果要取消周期性定時器,可以使用clearInterval()函數(shù)。例如:
總結(jié)
在JavaScript中,通過使用setTimeout()和setInterval()函數(shù),我們可以輕松地設(shè)置定時器。這樣可以讓我們實現(xiàn)一些定時/周期性任務(wù),比如動態(tài)效果、定時請求等等。但同時我們也要注意不要濫用定時器,否則會對性能產(chǎn)生影響。
使用setTimeout設(shè)置定時器
setTimeout()是設(shè)定一個定時器,指定一個時延時間后執(zhí)行一個函數(shù)。其基本語法為:
setTimeout(function,milliseconds);
其中,function為要執(zhí)行的函數(shù),milliseconds為時延時間(以毫秒為單位)。
例如,下面的代碼會在頁面打開2秒鐘后彈出一個提示框:
<script> function showMessage() { alert("Hello World!"); } <br> setTimeout(showMessage, 2000); </script>
如果要取消定時器,可以使用clearTimeout()函數(shù)。例如:
var t = setTimeout(showMessage, 2000); clearTimeout(t);
使用setInterval設(shè)置定時器
setInterval()也是設(shè)定一個定時器,但是它會周期性地執(zhí)行一個函數(shù)。它的基本語法為:
setInterval(function,milliseconds);
其中,function為要執(zhí)行的函數(shù),milliseconds為周期性時間間隔(以毫秒為單位)。
例如,下面的代碼會每隔1秒鐘輸出一次當(dāng)前時間:
<script> function showTime() { var now = new Date(); document.write(now.getHours() + ":" + now.getMinutes() + ":" + now.getSeconds() + "<br/>"); } <br> setInterval(showTime, 1000); </script>
如果要取消周期性定時器,可以使用clearInterval()函數(shù)。例如:
var t = setInterval(showTime, 1000); clearInterval(t);
總結(jié)
在JavaScript中,通過使用setTimeout()和setInterval()函數(shù),我們可以輕松地設(shè)置定時器。這樣可以讓我們實現(xiàn)一些定時/周期性任務(wù),比如動態(tài)效果、定時請求等等。但同時我們也要注意不要濫用定時器,否則會對性能產(chǎn)生影響。
上一篇css屬性快捷鍵