Window setInterval() 方法

  • Προηγούμενη σελίδα self
  • Επόμενη σελίδα setTimeout()
  • Επιστροφή στο προηγούμενο επίπεδο Όντα Window

定义和用法

setInterval() 方法以指定的时间间隔（以毫秒为单位）调用函数。

setInterval() 方法会周期性调用函数，直到调用 clearInterval() 或关闭窗口。

注释：1 秒 = 1000 毫秒。

提示

如需仅执行一次函数，请改用 setTimeout() 方法。

如需清除间隔，请使用 setInterval() 返回的 id：

myInterval = setInterval(function, milliseconds);

然后你可以通过调用 clearInterval() 来停止执行：

clearInterval(myInterval);

另请参阅：

clearInterval() 方法

setTimeout() 方法

clearTimeout() 方法

实例

例子 1

每秒显示 "Hello"（1000 毫秒）：

setInterval(function () {element.innerHTML += "Hello"}, 1000);

Δοκιμάστε το προσωπικά

例子 2

每秒调用一次 displayHello：

setInterval(displayHello, 1000);

Δοκιμάστε το προσωπικά

页面下方提供更多实例。

语法

setInterval(function, milliseconds, param1, param2, ...)

参数

参数 描述
function 必需。要执行的函数
milliseconds

必需。执行间隔。

如果值小于 10，则使用 10。
param1, param2, ...

可选。传递给函数的附加参数。

IE9 及更早版本不支持。

返回值

类型 描述
数字

计时器的 ID。

请将此 id 与 clearInterval() 一起使用以取消计时器。

浏览器支持

所有浏览器都支持 setInterval()

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη

Περισσότερες παραδείξεις

Παράδειγμα 3

Προβολή της ώρας όπως ένα ρολόι:

setInterval(myTimer, 1000);
function myTimer() {
  const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}

Δοκιμάστε το προσωπικά

Παράδειγμα 4

Απομάκρυνση του setInterval() για να σταματήσει το ρολόι:

const myInterval = setInterval(myTimer, 1000);
function myTimer() {
  const date = new Date();
  document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
function myStopFunction() {
  clearInterval(myInterval);
}

Δοκιμάστε το προσωπικά

Παράδειγμα 5

Δημιουργία δυναμικής προόδου με setInterval() και clearInterval():

function move() {
  const element = document.getElementById("myBar");
  let width = 0;
  let id = setInterval(frame, 10);
  function frame() {
    if (width == 100) {
      clearInterval(id);
    } else {
      width++;
      element.style.width = width + '%';
    }
  }
}

Δοκιμάστε το προσωπικά

Παράδειγμα 6

Αλλαγή μεταξύ δύο χρωμάτων περιβάλλοντος κάθε 500 χιλιοστών:

const myInterval = setInterval(setColor, 500);
function setColor() {
  let x = document.body;
  x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
  clearInterval(myInterval);
}

Δοκιμάστε το προσωπικά

Παράδειγμα 7

Παράδοση παραμέτρων στη συνάρτηση (δεν λειτουργεί στις εκδόσεις IE9 και παλιότερες):

setInterval(myFunc, 2000, "param1", "param2");

Δοκιμάστε το προσωπικά

Αλλά, αν χρησιμοποιήσετε ανώνυμο όνομα συνάρτησης, τότε είναι κατάλληλο για όλους τους περιηγητές:

setInterval(function() {myFunc("param1", "param2")}, 2000);

Δοκιμάστε το προσωπικά

  • Προηγούμενη σελίδα self
  • Επόμενη σελίδα setTimeout()
  • Επιστροφή στο προηγούμενο επίπεδο Όντα Window