Codifica JavaScript per un conto alla rovescia da 10 a 0

JavaScript è un linguaggio di script ben noto e ampiamente 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 questo è un file JavaScript. Aprire il file in un editor di testo, ad esempio Blocco note o WordPad.

2.

Definire due variabili (Timer e TotalSeconds) inserendo queste due linee:

var Timer; var TotalSeconds;

3.

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

function 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 si presenta così:

var Timer; var TotalSeconds;

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

4.

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

function Tick () {if (TotalSeconds <= 0) {alert ("Time up up") restituisce; } TotalSeconds - = 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

L'argomento "if (TotalSeconds <= 0)" assicura che il conto alla rovescia si fermi a zero e visualizza il "Tempo scaduto!" Messaggio. Il "window.setTimeout (" Tick () ", 1000);" la funzione garantisce 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:

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

6.

Il tuo script ora si presenta così:

var Timer; var TotalSeconds;

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

function Tick () {if (TotalSeconds <= 0) {alert ("Time up up") restituisce; } TotalSeconds - = 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

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

7.

Salva il file. Per usare lo script su una pagina web, usa questo codice HTML: