Fenêtre setInterval()
Exemples
Afficher "Hello" toutes les secondes (1000 millisecondes) :
setInterval(function () {element.innerHTML += "Hello"}, 1000);
Appelez displayHello toutes les secondes :
setInterval(displayHello, 1000);
Plus d'exemples ci-dessous.
Définition et utilisation
La setInterval()
méthode appelle une fonction à des intervalles spécifiés (en millisecondes).
La setInterval()
méthode continue d'appeler la fonction jusqu'à ce qu'elle
clearInterval()
soit appelée ou que la fenêtre soit fermée.
1 seconde = 1000 millisecondes.
Noter
Pour exécuter la fonction une seule fois, utilisez setTimeout()
plutôt la méthode.
Pour effacer un intervalle, utilisez l' identifiant renvoyé par setInterval() :
myInterval = setInterval(function, milliseconds);
Ensuite, vous pouvez arrêter l'exécution en appelant clearInterval() :
clearInterval(myInterval);
Voir également:
Syntaxe
setInterval(function, milliseconds, param1, param2, ...)
Paramètres
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. |
Valeur de retour
Taper | La description |
Un numéro | L'identifiant de la minuterie. Utilisez cet identifiant avec clearInterval() pour annuler la minuterie. |
Plus d'exemples
Exemple
Afficher l'heure comme une montre digitale :
setInterval(myTimer, 1000);
function myTimer()
{
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
Exemple
Utilisation de clearInterval() pour arrêter la montre numérique :
const myInterval = setInterval(myTimer, 1000);
function myTimer() {
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
function myStopFunction()
{
clearInterval(myInterval);
}
Exemple
Utilisation de setInterval() et clearInterval() pour créer une barre de progression dynamique :
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 + '%';
}
}
}
Exemple
Basculer entre deux couleurs d'arrière-plan une fois toutes les 500 ms :
const myInterval = setInterval(setColor, 500);
function setColor() {
let x = document.body;
x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
clearInterval(myInterval);
}
Exemple
Transmettez les paramètres à la fonction (ne fonctionne pas dans IE9 et versions antérieures) :
setInterval(myFunc, 2000, "param1", "param2");
Cependant, si vous utilisez une fonction anonyme, elle fonctionne dans tous les navigateurs :
setInterval(function() {myFunc("param1", "param2")}, 2000);
Prise en charge du navigateur
setInterval()
est pris en charge dans tous les navigateurs :
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes | Yes |