JavaScript kodning för en nedräkning från 10 till 0

JavaScript är ett välkänt och allmänt använt skriptspråk som används för att skriva program för webbsidor. Du kan skapa hundratals användbara appar med hjälp av JavaScript, inklusive en nedräkningstimer. Du kan koda ett JavaScript-skript för att visa en nedräkning från 10 till noll på din webbsida och visa ett meddelande när det når noll. JavaScript-skript kan skapas i valfri textredigerare, till exempel Anteckningar och WordPad, men måste sparas med en ".js" -tillägg för att vara funktionell.

1.

Skapa en ny textfil och namnge den "timer.js." ".Js" -tillägget indikerar att det här är en JavaScript-fil. Öppna filen i en textredigerare, t.ex. Anteckningar eller WordPad.

2.

Definiera två variabler (Timer och TotalSeconds) genom att infoga dessa två rader:

var Timer; var TotalSekunder;

3.

Skapa en ny funktion (CreateTimer) som visar timern på din webbsida genom att sätta in den här koden:

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

"Window.setTimeout (" Tick () ", 1000);" funktionen gör timern kryssa varannan sekund. Ditt skript ser nu ut så här:

var Timer; var TotalSekunder;

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

4.

Lägg till en funktion som tvingar timern att minska med en sekund varje ficka:

funktion Tick () {if (TotalSeconds <= 0) {alert ("Time up!") returnera; } TotalSekunder - = 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

Argumentet "if (TotalSeconds <= 0)" säkerställer att nedräkningen stannar vid noll och visar "Time's up!" meddelande. "Window.setTimeout (" Tick () ", 1000);" funktionen garanterar att nedräkningen fortsätter tills den når noll.

5.

Sätt in en funktion för att uppdatera timern varje kryss så att du kan se nedräkningen:

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

6.

Ditt skript ser nu ut så här:

var Timer; var TotalSekunder;

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

funktion Tick () {if (TotalSeconds <= 0) {alert ("Time up!") returnera; } TotalSekunder - = 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }

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

7.

Spara filen. För att använda skriptet på en webbsida, använd den här HTML-koden: