溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要講解了“javascript定時器有什么函數”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“javascript定時器有什么函數”吧！
javascript定時器有2個函數，分別為：1、setTimeout()函數，用于在指定的時間后（單位為毫秒），執行某些代碼，代碼只會執行一次；2、setInterval()函數，用于按照指定的周期（單位為毫秒）來重復執行某些代碼。
本教程操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。
JavaScript 定時器，有時也稱為“計時器”，用來在經過指定的時間后執行某些任務，類似于我們生活中的鬧鐘。
在 JavaScript 中，我們可以利用定時器來延遲執行某些代碼，或者以固定的時間間隔重復執行某些代碼。例如，您可以使用定時器定時更新頁面中的廣告或者顯示一個實時的時鐘等。
JavaScript 中提供了兩種方式來設置定時器，分別是 setTimeout() 和 setInterval()，它們之間的區別如下：
| 方法 | 說明 |
|---|---|
| setTimeout() | 在指定的時間后（單位為毫秒），執行某些代碼，代碼只會執行一次 |
| setInterval() | 按照指定的周期（單位為毫秒）來重復執行某些代碼，定時器不會自動停止，除非調用 clearInterval() 函數來手動停止或著關閉瀏覽器窗口 |
setTimeout()
JS setTimeout() 函數用來在指定時間后執行某些代碼，代碼僅執行一次。
JS setTimeout() 函數的語法格式如下：
setTimeout(code,millisec)
參數說明如下：
code 必需。要調用的函數后要執行的 JavaScript 代碼串。
millisec 必需。在執行代碼前需等待的毫秒數。
示例代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript</title>
</head>
<body>
<script type="text/javascript">
var myFun = function (str = 'JavaScript'){
document.write(str + "<br>");
};
setTimeout(myFun, 500, 'Hello');
setTimeout(myFun, 1000);
setTimeout(function(){
document.write("定時器<br>");
}, 1500)
setTimeout("document.write(\"setTimeout()\")", 2000);
</script>
</body>
</html>運行上面的代碼，會間隔 500 毫秒，依次輸出下面的內容：
Hello JavaScript 定時器 setTimeout()
setInterval()
JS setInterval() 函數可以定義一個能夠重復執行的定時器，每次執行需要等待指定的時間間隔。
JS setInterval() 函數的語法格式如下：
setInterval(code,millisec[,"lang"])
參數說明如下：
code 必需。要調用的函數或要執行的代碼串。
millisec 必須。周期性執行或調用 code 之間的時間間隔，以毫秒計。
提示：通過 setInterval() 函數定義的定時器不會自動停止，除非調用 clearInterval() 函數來手動停止或著關閉瀏覽器窗口。
示例代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript</title>
</head>
<body>
<p id="one"></p>
<p id="two"></p>
<script type="text/javascript">
var num = 1;
var myFun = function (){
document.getElementById('one').innerHTML += num + " ";
num ++;
};
setInterval(myFun, 500);
setInterval(function(){
var d = new Date();
document.getElementById('two').innerHTML = d.toLocaleTimeString();
}, 1000);
</script>
</body>
</html>運行結果如下：
JS 取消定時器
當使用 setTimeout() 或 setInterval() 設置定時器時，這兩個方法都會產生一個定時器的唯一 ID，ID 為一個正整數值，也被稱為“定時器標識符”，通過這個 ID，我們可以清除 ID 所對應的定時器。
我們可以借助 clearTimeout() 或 clearInterval() 函數來分別清除由 setTimeout() 或 setInterval() 函數創建的定時器。調用 clearTimeout() 或 clearInterval() 函數需要提供定時器的唯一 ID 作為參數，示例代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript</title>
</head>
<body>
<p>當前時間為：<span id="clock"></span></p>
<button onclick="stopClock(this);">停止</button><hr>
<button onclick="delayedAlert(this);">2秒后彈出一個提示框</button>
<button onclick="clearAlert();">取消</button>
<script type="text/javascript">
var intervalID;
function showTime() {
var d = new Date();
document.getElementById("clock").innerHTML = d.toLocaleTimeString();
}
function stopClock(e) {
clearInterval(intervalID);
e.setAttribute('disabled', true)
}
intervalID = setInterval(showTime, 1000);
var timeoutID;
var that;
function delayedAlert(e) {
that = e;
timeoutID = setTimeout(showAlert, 2000);
e.setAttribute('disabled', true)
}
function showAlert() {
alert('這是一個提示框。');
that.removeAttribute('disabled');
}
function clearAlert() {
clearTimeout(timeoutID);
that.removeAttribute('disabled');
}
</script>
</body>
</html>運行結果如下圖所示：
感謝各位的閱讀，以上就是“javascript定時器有什么函數”的內容了，經過本文的學習后，相信大家對javascript定時器有什么函數這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
