Codifica JavaScript per un conto alla rovescia da 10 a 0

JavaScript è un linguaggio di scripting ben noto e ampiamente utilizzato utilizzato principalmente per scrivere applicazioni per pagine Web. Puoi creare centinaia di app utili utilizzando JavaScript, incluso un timer per il conto alla rovescia. È possibile codificare uno script JavaScript per visualizzare un conto alla rovescia da 10 a zero sulla pagina Web e visualizzare un messaggio quando raggiunge lo zero. Gli script JavaScript possono essere creati in qualsiasi editor di testo, come Blocco note e WordPad, ma devono essere salvati con un’estensione “.js” per essere funzionali.

1

Crea un nuovo file di testo e chiamalo “timer.js”. L’estensione “.js” indica che si tratta di un file JavaScript. Apri il file in un editor di testo, come Blocco note o WordPad.

2

Definisci due variabili (Timer e TotalSeconds) inserendo queste due righe:

var Timer; era TotalSeconds;

3

Crea una nuova funzione (CreateTimer) che visualizzi il timer sulla tua pagina Web inserendo questo codice:

funzione CreateTimer (TimerID, Time) {Timer = document.getElementById (TimerID); TotalSeconds = Tempo; UpdateTimer () window.setTimeout (“Tick ()”, 1000); }

Il “window.setTimeout (” Tick () “, 1000);” la funzione fa scattare il timer ogni secondo. Il tuo script ora ha questo aspetto:

var Timer; era TotalSeconds;

funzione CreateTimer (TimerID, Time) {Timer = document.getElementById (TimerID); TotalSeconds = Tempo; UpdateTimer () window.setTimeout (“Tick ()”, 1000); }

4

Aggiungi una funzione che costringa il timer a diminuire di un secondo ogni tick:

funzione Tick () {if (TotalSeconds <= 0) {alert (“Time’s up!”) return; } TotalSeconds – = 1; UpdateTimer () window.setTimeout (“Tick ()”, 1000); }

L’argomento “if (TotalSeconds <= 0)” assicura che il conto alla rovescia si fermi a zero e visualizzi “Tempo scaduto!” Messaggio. Il “window.setTimeout (” Tick () “, 1000);” la funzione assicura che il conto alla rovescia continui fino a quando non raggiunge lo zero.

5

Inserisci una funzione per aggiornare il timer ogni tick in modo da poter vedere il conto alla rovescia:

funzione UpdateTimer () {Timer.innerHTML = TotalSeconds; }

6

Il tuo script ora ha questo aspetto:

var Timer; era TotalSeconds;

funzione CreateTimer (TimerID) {Timer = document.getElementById (TimerID); TotalSeconds = 10; UpdateTimer () window.setTimeout (“Tick ()”, 1000); }

funzione Tick () {if (TotalSeconds <= 0) {alert (“Time’s up!”) return; } TotalSeconds – = 1; UpdateTimer () window.setTimeout (“Tick ()”, 1000); }

funzione UpdateTimer () {Timer.innerHTML = TotalSeconds; }

7

Salva il file. Per utilizzare lo script su una pagina Web, utilizza questo codice HTML:

window.onload = CreateTimer (“YourTimer”);