以固定间隔重复执行某个操作

在本课中，你将学习如何反复修改元素的内容。下面给出了相关的 HTML 代码和对应的 JavaScript 代码。

程序运行正常。尽管倒计时不会停止，我们稍后会进行修复。

启动重复动作

前面的例子是如何工作的？JavaScript 代码定义了一个名为 decreaseCounter() 的函数，该函数访问并逐次减少名为 counter 的 HTML 元素的值。

在函数代码中调用 Number() 是必要的：它将计数器的字符串转换为数字，从而使其具备减法功能。

调用 setInterval() 触发了重复动作。此函数允许你以固定的时间间隔调用某个函数。它的参数是需要调用的函数以及每次调用之间的毫秒数。返回值是重复动作的 ID，可用于进一步修改该动作。

停止重复动作

让我们尝试在倒计时结束后停止计数器，并同时修改页面的文字。以下是更新后的 JavaScript 代码，以实现我们期望的效果：

在 decreaseCounter() 函数中，只有当当前值大于 1 时才减少计数器。否则，调用 clearInterval() 函数，并修改页面标题。clearInterval() 函数用于终止重复执行的代码。它接收由 setInterval() 调用设置的动作 ID 作为参数。

延迟触发动作

假设你想在前一个例子中页面“爆炸”之后修改页面文字。你可以按如下方式修改示例：

倒计时结束后，我们调用 setTimeout() 函数，在 2 秒（2000 毫秒）延迟后设置新的页面标题。setTimeout() 函数允许你在指定延迟时间后仅执行一次某个函数，延迟时间以毫秒表示。