O setInterval() O método em JavaScript é usado para repetir uma função especificada em cada intervalo de tempo determinado. Ele avalia uma expressão ou chama uma função em determinados intervalos. Este método continua a chamada da função até que a janela seja fechada ou o clearInterval() método é chamado. Este método retorna um valor numérico ou um número diferente de zero que identifica o temporizador criado.
Ao contrário do setTimeout() método, o setInterval() método invoca a função várias vezes. Este método pode ser escrito com ou sem o janela prefixo.
A sintaxe comumente usada de setInterval() método é fornecido abaixo:
Sintaxe
window.setInterval(function, milliseconds);
Valores de parâmetros
Este método leva dois valores de parâmetro função e milissegundos que são definidos a seguir.
função: É a função que contém o bloco de código que será executado.
milissegundos: Este parâmetro representa a duração do intervalo de tempo entre cada execução. O intervalo está em milissegundos. Ele define com que frequência o código será executado. Se seu valor for menor que 10, o valor 10 será usado.
Como parar a execução?
Podemos usar o clearInterval() método para interromper a execução da função especificada em setInterval() método. O valor retornado pelo setInterval() método pode ser usado como argumento de clearInterval() método para cancelar o tempo limite.
Vamos entender o uso de setInterval() método usando algumas ilustrações.
Exemplo 1
Este é um exemplo simples de uso do setInterval() método. Aqui, uma caixa de diálogo de alerta é exibida em um intervalo de 3 segundos. Não estamos usando nenhum método para interromper a execução da função especificada em setInterval() método. Assim o método continua a execução da função até que a janela seja fechada.
setInterval() method <h3> This is an example of using the setInterval() method </h3> <p> Here, the background color changes on every 200 milliseconds. </p> Stop var var1 = setInterval(color, 200); function color() { var var2 = document.body; var2.style.backgroundColor = var2.style.backgroundColor == 'lightblue' ? 'lightgreen' : 'lightblue'; } function stop() { clearInterval(var1); }Teste agora
Saída
A cor do fundo começará a mudar após 200 milissegundos. Ao clicar no especificado parar botão, a alternância entre as cores será interrompida na cor de fundo correspondente. A saída após clicar no botão será -