JavaScript 计时事件
|
1
2
3
4
5
6
7
8
9
10
11
12
|
JavaScript 可以按时间间隔执行。 这被称为定时事件。 |
计时事件
这 window 对象允许以指定的时间间隔执行代码。
这些时间间隔被称为定时事件。
JavaScript 使用的两个主要方法是：
setTimeout(function, milliseconds)
等待指定的毫秒数后执行一个函数。setInterval(function, milliseconds)
与setTimeout()相同，但不断重复执行该函数。
这 setTimeout() 和setInterval() 都是 HTML DOM Window 对象的方法。
setTimeout() 方法
窗口.setTimeout（功能, 毫秒);
这 window.setTimeout() 方法可以不带窗口前缀。
第一个参数是要执行的函数。
第二个参数表示执行前的毫秒数。
例子
点击按钮，等待3秒，页面提示“Hello”：
<button onclick="setTimeout(myFunction, 3000)">尝试一下</button>
<script>
函数 myFunction() {
警报（'你好'）；
}
</script>
亲自尝试 »
如何停止执行？
这 clearTimeout() 方法停止 setTimeout() 中指定的函数的执行。
窗口.clearTimeout（超时变量)
这 window.clearTimeout() 方法可以不带窗口前缀。
这 clearTimeout() 方法使用从setTimeout():
myVar = 设置超时（功能, 毫秒);
清除超时（我的变量）；
如果该函数尚未执行，您可以通过调用 clearTimeout() 方法：
例子
与上面的例子相同，但添加了“停止”按钮：
<button onclick="myVar = setTimeout(myFunction, 3000)">尝试一下</button>
<button onclick="clearTimeout(myVar)">停下来</button>
亲自尝试 »
setInterval() 方法
这 setInterval() 方法在每个给定的时间间隔重复给定的功能。
窗口.setInterval（功能, 毫秒);
这 window.setInterval() 方法可以不带窗口前缀。
第一个参数是要执行的函数。
第二个参数表示每次执行之间的时间间隔长度。
此示例每秒执行一次名为“myTimer”的函数（就像电子手表一样）。
例子
显示当前时间：
设置间隔（我的计时器，1000）；
函数 myTimer() {
const d = 新日期();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
亲自尝试 »
一秒有1000毫秒。
如何停止执行？
这 clearInterval() 方法停止 setInterval() 方法中指定的函数的执行。
窗口.clearInterval（定时器变量)
这 window.clearInterval() 方法可以不带窗口前缀。
这 clearInterval() 方法使用从setInterval():
让 myVar = setInterval(功能, 毫秒);
清除间隔（我的变量）；
例子
与上面的例子相同，但我们添加了一个“停止时间”按钮：
<p id="demo"></p>
<button onclick="clearInterval(myVar)">停止时间</button>
<script>
让 myVar = setInterval(myTimer， 1000);
函数 myTimer() {
const d = 新日期();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
</script>
亲自尝试 »
