janela setInterval()
Exemplos
Exibir "Olá" a cada segundo (1000 milissegundos):
setInterval(function () {element.innerHTML += "Hello"}, 1000);
Chame displayHello a cada segundo:
setInterval(displayHello, 1000);
Mais exemplos abaixo.
Definição e uso
O setInterval()método chama uma função em intervalos especificados (em milissegundos).
O setInterval()método continua chamando a função até
clearInterval()ser chamado ou a janela ser fechada.
1 segundo = 1000 milissegundos.
Observação
Para executar a função apenas uma vez, use o setTimeout()método.
Para limpar um intervalo, use o id retornado de setInterval():
myInterval = setInterval(function, milliseconds);
Então você pode parar a execução chamando clearInterval():
clearInterval(myInterval);
Veja também:
Sintaxe
setInterval(function, milliseconds, param1, param2, ...)
Parâmetros
| 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. |
Valor de retorno
| Modelo | Descrição |
| Um número | O id do temporizador. Use este id com clearInterval() para cancelar o cronômetro. |
Mais exemplos
Exemplo
Exiba a hora como um relógio digital:
setInterval(myTimer, 1000);
function myTimer()
{
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
Exemplo
Usando clearInterval() para parar o relógio digital:
const myInterval = setInterval(myTimer, 1000);
function myTimer() {
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
function myStopFunction()
{
clearInterval(myInterval);
}
Exemplo
Usando setInterval() e clearInterval() para criar uma barra de progresso dinâmica:
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 + '%';
}
}
}
Exemplo
Alterne entre duas cores de fundo uma vez a cada 500 milissegundos:
const myInterval = setInterval(setColor, 500);
function setColor() {
let x = document.body;
x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
clearInterval(myInterval);
}
Exemplo
Passe parâmetros para a função (não funciona no IE9 e anteriores):
setInterval(myFunc, 2000, "param1", "param2");
No entanto, se você usar uma função anônima, ela funcionará em todos os navegadores:
setInterval(function() {myFunc("param1", "param2")}, 2000);
Suporte ao navegador
setInterval()é suportado em todos os navegadores:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes | Yes |