De setInterval() methode in JavaScript wordt gebruikt om een ​​gespecificeerde functie op elk gegeven tijdsinterval te herhalen. Het evalueert een uitdrukking of roept een functie op bepaalde intervallen aan. Deze methode gaat door met het aanroepen van de functie totdat het venster wordt gesloten of de clearInterval() methode wordt genoemd. Deze methode retourneert een numerieke waarde of een getal dat niet nul is, dat de gemaakte timer identificeert.
In tegenstelling tot de setTimeout() methode, de setInterval() methode roept de functie meerdere keren aan. Deze methode kan worden geschreven met of zonder de raam voorvoegsel.
De veelgebruikte syntaxis van setInterval() methode vindt u hieronder:
Syntaxis
window.setInterval(function, milliseconds);
Parameterwaarden
Deze methode gebruikt twee parameterwaarden functie En milliseconden die als volgt worden gedefinieerd.
functie: Het is de functie die het codeblok bevat dat wordt uitgevoerd.
milliseconden: Deze parameter vertegenwoordigt de lengte van het tijdsinterval tussen elke uitvoering. Het interval is in milliseconden. Het definieert hoe vaak de code wordt uitgevoerd. Als de waarde kleiner is dan 10, wordt de waarde 10 gebruikt.
Hoe de executie stopzetten?
Wij kunnen gebruik maken van de clearInterval() methode om de uitvoering van de functie opgegeven in te stoppen setInterval() methode. De waarde die wordt geretourneerd door de setInterval() methode kan worden gebruikt als argument voor clearInterval() methode om de time-out te annuleren.
Laten we het gebruik van begrijpen setInterval() methode aan de hand van enkele illustraties.
Voorbeeld 1
Dit is een eenvoudig voorbeeld van het gebruik van de setInterval() methode. Hier wordt een waarschuwingsdialoogvenster weergegeven met een interval van 3 seconden. We gebruiken geen enkele methode om de uitvoering van de functie die is opgegeven in te stoppen setInterval() methode. De methode gaat dus door met het uitvoeren van de functie totdat het venster wordt gesloten.
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); } Test het nu Uitvoer
De kleur van de achtergrond begint na 200 milliseconden te veranderen. Door op het opgegeven te klikken stop knop, wordt het schakelen tussen de kleuren gestopt op de overeenkomstige achtergrondkleur. De uitvoer na het klikken op de knop zal zijn -
