Exemple de chronomètre

La méthode window.setInterval permet l'appel d'une fonction à intervalle régulier, tandis que la méthode window.clearTimeout met fin à ces appels répétitifs.

Dans cet exemple, on programme l'exécution de la fonction tictictic à toutes les secondes. Cette fonction décrémente un compteur et en affiche la valeur dans un paragraphe du document HTML (élément p). Quand le compteur arrive à zéro, on arrête l'exécution automatique.

Code HTML :

<!-- affichage en gros caractères -->
<p id="affichage" style="margin: 50px; font-size: 2em;">10</p>

Code JavaScript :

// secondes à écouler
let secondes = 10;

// élément où afficher le décompte
let para = document.getElementById("affichage");

// lance l'exécution de la fonction à toutes les secondes
let chrono = window.setInterval(tictictic, 1000);

// ---------------------------------------------------------
// Décrémente le nombre de secondes à écouler, affiche cette
// quantité et arrête le décompte lorsque terminé.
// ---------------------------------------------------------
function tictictic() {
  secondes--;
  para.innerHTML = secondes;
  if (secondes == 0) {
    // arrête l'exécution lancée avec setInterval()
    window.clearTimeout(chrono);
  }
}