setInterval() 方法是 JavaScript 中常用的定时器函数，用于在指定时间间隔内反复执行指定的代码。默认情况下，setInterval() 的运行区间为每隔一段时间无限重复执行。但有时我们需要改变它的运行区间，比如只在某个时间段内执行或者只执行固定次数。本文将介绍如何改变 setInterval() 的运行区间，以及注意事项和示例代码。
改变运行区间的方法
1. 使用 setTimeout()
setInterval() 方法可以与 setTimeout() 方法联合使用，通过控制 setTimeout() 的运行次数来实现 setInterval() 的运行区间改变。例如，下面的代码将 setInterval() 的运行区间设置为 5 秒钟：
--- ----- - --
----- -------- - -------------- -- -
------------------ --------
--------
-- ------ --- -- -
------------------------
-
-- ------ -- -- - ------
------------- -- -
------------------------
-- ------ -- - ---- -------------这个例子中，setInterval() 每隔 1 秒钟执行一次，但是通过 setTimeout() 控制，只执行了 3 次，即总共执行了 3 秒钟。
2. 使用计时器变量
另一种改变 setInterval() 运行区间的方法是使用计时器变量。通过在 setInterval() 中记录时间并判断是否达到指定时间来控制运行区间。例如，下面的代码将 setInterval() 的运行区间设置为 5 秒钟：
--- ----- - --
--- --------- - --- -----------------
----- -------- - -------------- -- -
------------------ --------
--------
----- ------- - --- -----------------
-- -------- - --------- -- ----- -
------------------------
-
-- ------ -- -- - ------这个例子中，setInterval() 每隔 1 秒钟执行一次，并且在每次执行后记录结束时间，并与起始时间比较，当达到 5 秒钟时停止 setInterval()。
注意事项
- 改变
setInterval()运行区间的方法需要自己掌握时间，确保代码能够在指定时间内正确执行。 - 使用计时器变量时，要注意浏览器窗口失去焦点时
setInterval()的执行会被暂停，进而影响计时器变量的记录。
示例代码
下面的示例代码演示了如何改变 setInterval() 的运行区间。
-- ------ ------------
--- ----- - --
----- -------- - -------------- -- -
------------------ --------
--------
-- ------ --- -- -
------------------------
-
-- ------ -- -- - ------
------------- -- -
------------------------
-- ------ -- - ---- -------------
-- -----------
--- ----- - --
--- --------- - --- -----------------
----- -------- - -------------- -- -
------------------ --------
--------
----- ------- - --- -----------------
-- -------- - --------- -- ----- -
------------------------
-
-- ------ -- -- - ------来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/10084