Menu
Coddy logo textTech

Cronometro funzionante

Lezione 9 di 10 del corso Cronometro - Progetto HTML/CSS/JS di Coddy.

Ora che abbiamo i pulsanti di avvio e arresto funzionanti, è il momento di iniziare a contare!

Per contare, useremo una funzione JavaScript chiamata setInterval:

const interval = setInterval(func, milliseconds)

La funzione riceve due argomenti: una funzione e un numero che rappresenta i millisecondi. La funzione viene chiamata ogni numero di millisecondi specificato.

Per esempio:

let count = 0

function updateCount() {
	count += 1;
}

const interval = setInterval(updateCount, 1000)

Nell'esempio qui sopra, incrementiamo di 1 la variabile count ogni secondo.

Se vuoi interrompere un intervallo, usa clearInterval con il valore restituito da setInterval:

const interval = setInterval(updateCount, 1000)
clearInterval(interval)
challenge icon

Sfida

Medio

Aggiungi il seguente supporto al tuo file JS:

  • Quando si fa clic sul pulsante di avvio/arresto, imposta un intervallo che aggiorni il testo del cronometro ogni secondo di uno, assicurati che sia formattato correttamente.
  • Quando si fa clic di nuovo sul pulsante di avvio/arresto, cancella l'intervallo in esecuzione.

Dopo aver aggiunto un setInterval al tuo codice, dovrai fare clic sul pulsante di reimpostazione nella vista web:

Provalo tu

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Scrivi il codice HTML qui -->
        <script src="script.js"></script>
    </body>
</html>

Tutte le lezioni di Cronometro - Progetto HTML/CSS/JS

1Introduzione

Panoramica

4Parte JS

Avvio e arresto di baseLezione di progettoCronometro funzionanteLezione di progettoReimpostaLezione di progetto

Esercitati da solo: Playground Web