VenstersetInterval()
Voorbeelden
Geef elke seconde "Hallo" weer (1000 milliseconden):
setInterval(function () {element.innerHTML += "Hello"}, 1000);
Bel displayHallo elke seconde:
setInterval(displayHello, 1000);
Hieronder meer voorbeelden.
Definitie en gebruik
De setInterval()methode roept een functie aan op gespecificeerde intervallen (in milliseconden).
De setInterval()methode blijft de functie aanroepen totdat deze
clearInterval()wordt aangeroepen of het venster wordt gesloten.
1 seconde = 1000 milliseconden.
Opmerking
Gebruik setTimeout()in plaats daarvan de methode om de functie slechts één keer uit te voeren.
Gebruik de id die is geretourneerd door setInterval() om een interval te wissen:
myInterval = setInterval(function, milliseconds);
Vervolgens kunt u de uitvoering stoppen door clearInterval() aan te roepen:
clearInterval(myInterval);
Zie ook:
Syntaxis
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. |
Winstwaarde
| Type | Beschrijving |
| Een getal | Het ID van de timer. Gebruik deze id met clearInterval() om de timer te annuleren. |
Meer voorbeelden
Voorbeeld
Geef de tijd weer als een digitaal horloge:
setInterval(myTimer, 1000);
function myTimer()
{
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
Voorbeeld
ClearInterval() gebruiken om het digitale horloge te stoppen:
const myInterval = setInterval(myTimer, 1000);
function myTimer() {
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
function myStopFunction()
{
clearInterval(myInterval);
}
Voorbeeld
SetInterval() en clearInterval() gebruiken om een dynamische voortgangsbalk te maken:
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 + '%';
}
}
}
Voorbeeld
Wissel elke 500 milliseconden tussen twee achtergrondkleuren:
const myInterval = setInterval(setColor, 500);
function setColor() {
let x = document.body;
x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
clearInterval(myInterval);
}
Voorbeeld
Geef parameters door aan de functie (werkt niet in IE9 en eerder):
setInterval(myFunc, 2000, "param1", "param2");
Als u echter een anonieme functie gebruikt, werkt deze in alle browsers:
setInterval(function() {myFunc("param1", "param2")}, 2000);
Browserondersteuning
setInterval() wordt ondersteund in alle browsers:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes | Yes |