js 定時器
只執行一次函數的定時器, 對應的代碼是setTimeout函數 反復執行函數的定時器, 對應的代碼是setInterval函數
https://blog.csdn.net/weixin_48135624/article/details/115290662
1. 定時器的介紹
定時器就是在一段特定的時間后執行某段程序代碼。
2. 定時器的使用：
js 定時器有兩種創建方式：
- setTimeout(func[, delay, param1, param2, ...]) ：以指定的時間間隔（以毫秒計）調用一次函數的定時器
- setInterval(func[, delay, param1, param2, ...]) ：以指定的時間間隔（以毫秒計）重復調用一個函數的定時器
setTimeout函數的參數說明:
- 第一個參數 func , 表示定時器要執行的函數名
- 第二個參數 delay, 表示時間間隔，默認是0，單位是毫秒
- 第三個參數 param1, 表示定時器執行函數的第一個參數，一次類推傳入多個執行函數對應的參數。
-
<script>
-
function
hello(
){
-
alert(
'hello');
-
}
-
-
// 執行一次函數的定時器
-
setTimeout(hello,
500);
-
</script>
setInterval函數的參數說明:
- 第一個參數 func , 表示定時器要執行的函數名
- 第二個參數 delay, 表示時間間隔，默認是0，單位是毫秒
- 第三個參數 param1, 表示定時器執行函數的第一個參數，一次類推傳入多個執行函數對應的參數。
-
<script>
-
function
hello(
){
-
alert(
'hello');
-
}
-
// 重復執行函數的定時器
-
setInterval(hello,
1000);
-
</script>
2. 清除定時器
js 清除定時器分別是:
- clearTimeout(timeoutID) 清除只執行一次的定時器(setTimeout函數)
- clearInterval(timeoutID) 清除反復執行的定時器(setInterval函數)
clearTimeout函數的參數說明:
- timeoutID 為調用 setTimeout 函數時所獲得的返回值，使用該返回標識符作為參數，可以取消該 setTimeout 所設定的定時執行操作。
-
<script>
-
function
hello(
){
-
alert(
'hello');
-
// 清除只執行一次的定時器
-
clearTimeout(t1)
-
}
-
// 執行一次函數的定時器
-
t1 =
setTimeout(hello,
500);
-
</script>
clearInterval函數的參數說明:
- timeoutID 為調用 setInterval 函數時所獲得的返回值，使用該返回標識符作為參數，可以取消該 setInterval 所設定的定時執行操作。
-
<script>
-
function
hello(
){
-
alert(
'hello');
-
}
-
// 重復執行函數的定時器
-
var t1 =
setInterval(hello,
1000);
-
-
function
stop(
){
-
// 清除反復執行的定時器
-
clearInterval(t1);
-
}
-
-
</script>
-
-
<input type="button" value="停止" onclick="stop();">
-
5. 小結
- 定時器的創建
- 只執行一次函數的定時器, 對應的代碼是setTimeout函數
- 反復執行函數的定時器, 對應的代碼是setInterval函數
- 清除定時器
- 清除只執行一次函數的定時器, 對應的代碼是clearTimeout函數
- 清除清除反復執行的定時器, 對應的代碼是clearInterval函數