Window setInterval()

❮ Previous ❮ Window Object Reference Next ❯

Examples

Display "Hello" every second (1000 milliseconds):

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

Try it Yourself »

Call displayHello every second:

setInterval(displayHello, 1000);

Try it Yourself »

More examples below.

Definition and Usage

The setInterval() method calls a function at specified intervals (in milliseconds).

The setInterval() method continues calling the function until clearInterval() is called, or the window is closed.

1 second = 1000 milliseconds.

Note

To execute the function only once, use the setTimeout() method instead.

To clear an interval, use the id returned from setInterval():

myInterval = setInterval(function, milliseconds);

Then you can to stop the execution by calling clearInterval():

clearInterval(myInterval);

Syntax

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

Parameters

Parameter	Description
function	Required. The function to execute
milliseconds	Required. The execution interval. If the value is less than 10, 10 is used
param1, param2, ...	Optional. Additional parameters to pass to the function Not supported in IE9 and earlier.

Return Value

Type	Description
A number	The id of the timer. Use this id with clearInterval() to cancel the timer.

More Examples

Example

Display the time like a digital watch:

setInterval(myTimer, 1000);

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

Try it Yourself »

Example

Using clearInterval() to stop the digital watch:

const myInterval = setInterval(myTimer, 1000);

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

function myStopFunction() {
clearInterval(myInterval);
}

Try it Yourself »

Example

Using setInterval() and clearInterval() to create a dynamic progress bar:

Try it Yourself »

Example

Toggle between two background colors once every 500 milliseconds:

const myInterval = setInterval(setColor, 500);

function setColor() {
  let x = document.body;
  x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}

function stopColor() {
  clearInterval(myInterval);
}

Try it Yourself »