Codificare JavaScript pentru o numărătoare inversă de la 10 la 0

JavaScript este un limbaj de scriptare bine cunoscut și utilizat pe scară largă, utilizat în special pentru a scrie aplicații pentru pagini web. Puteți crea sute de aplicații utile folosind JavaScript, inclusiv un temporizator. Puteți codifica un script JavaScript pentru a afișa o numărătoare inversă de la 10 la zero pe pagina dvs. Web și a afișa un mesaj când acesta ajunge la zero. Scripturile JavaScript pot fi create în orice editor de text, cum ar fi Notepad și WordPad, dar trebuie să fie salvate cu o extensie „.js” pentru a fi funcționale.

1

Creați un fișier text nou și denumiți-l „timer.js”. Extensia „.js” indică faptul că acesta este un fișier JavaScript. Deschideți fișierul într-un editor de text, cum ar fi Notepad sau WordPad.

2

Definiți două variabile (Timer și TotalSeconds) inserând aceste două linii:

var Timer; var TotalSeconds;

3

Creați o nouă funcție (CreateTimer) care afișează temporizatorul pe pagina dvs. web prin inserarea acestui cod:

funcția CreateTimer (TimerID, Time) {Timer = document.getElementById (TimerID); TotalSeconds = Timp; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

"Window.setTimeout (" Tick () ", 1000);" funcția face ca temporizatorul să bifeze la fiecare secundă. Scriptul dvs. arată acum:

var Temporizator; var TotalSeconds;

funcția CreateTimer (TimerID, Time) {Timer = document.getElementById (TimerID); TotalSeconds = Timp; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

4

Adăugați o funcție care forțează cronometrul să scadă cu o secundă la fiecare bifare:

funcție Tick () {if (TotalSeconds <= 0) {alert ("Timpul a trecut!") returnează; } TotalSeconds - = 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

Argumentul „if (TotalSeconds <= 0)” asigură că numărătoarea inversă se oprește la zero și afișează „Timpul a expirat!” mesaj. "Window.setTimeout (" Tick () ", 1000);" funcția asigură că numărătoarea inversă continuă până ajunge la zero.

5

Introduceți o funcție pentru a actualiza cronometrul la fiecare bifă, astfel încât să puteți vedea numărătoarea inversă:

funcție UpdateTimer () {Timer.innerHTML = TotalSeconds; }

6

Scriptul dvs. arată acum:

var Timer; var TotalSeconds;

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

funcție Tick () {if (TotalSeconds <= 0) {alert ("Timpul a trecut!") returnează; } TotalSeconds - = 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

funcție UpdateTimer () {Timer.innerHTML = TotalSeconds; }

7

Salvați fișierul. Pentru a utiliza scriptul pe o pagină web, utilizați acest cod HTML:


$config[zx-auto] not found$config[zx-overlay] not found