JavaScript 是一種廣泛應用于互聯網的編程語言,它具有豐富的特性,其中的定時器就是其中之一。定時器是用于在指定時間后創建一個函數或代碼塊的 JavaScript 方法。 它可以被用來在一些場景下表現出異步性,達到特定需求。在本文中,我們將探討 JavaScript 的第六種定時器,setInterval(),并且通過舉例說明如何使用定時器。
setInterval() 是用于在指定時間間隔執行一次或多次的方法。 下面是 setIntervak() 方法的語法:
var intervalID = scope.setInterval(func, delay[, param1, param2, ...]);
其中,intervalID 是返回的定時器 ID 值;func 是在所指定時間間隔內執行的函數名稱或者一個代碼塊;delay 是一個以毫秒為單位的整數,表示周期性執行所需要等待的時間。
下面是一個簡單的例子。代碼塊中的文字會在每個 1 秒鐘的時間間隔下修改一次。下面的代碼塊,每間隔一秒鐘,都會將最新時間插入到 id 為 “clock” 的 DOM 元素中:
<!DOCTYPE html> <html> <head> <title>JavaScript Interval Example</title> </head> <body> <h1>JavaScript Interval Example</h1> <p id="clock"></p> <script> function startTime() { var today = new Date(); var h = today.getHours(); var m = today.getMinutes(); var s = today.getSeconds(); m = checkTime(m); s = checkTime(s); document.getElementById('clock').innerHTML = h + ":" + m + ":" + s; var t = setInterval(startTime, 1000); } function checkTime(i) { if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10 return i; } startTime(); </script> </body> </html>
在上述示例中,startTime() 函數是首先調用的。此函數定義了檢查時間的函數 checkTime(i),并將時鐘放入所選 DOM 元素中。 另外,定時器的實際設置在 setIntervak() 方法中,每隔一秒鐘開始一次新的時鐘更新。 可以看到,通過 setInterval() 方法,每隔一定時間就可以反復運行一個函數,在實際開發中會有非常廣泛的應用。
總結:有了此文的介紹,您現在應該能夠了解 setInterval() 是用來重復運行函數的 JavaScript 方法。此方法使用時應將所需的參數傳遞給該方法來設置定時器,并且應避免運行周期性函數時出現可能的負面影響。 定時器對于實現一些 JavaScript 動畫、輪詢、定時執行腳本等等,有著廣泛的應用。每個 Web 開發者都應該熟練掌握定時器并且在項目中加以應用。