Program JavaScript pentru a crea temporizator de numărătoare inversă

În acest exemplu, veți învăța să scrieți un program JavScript care va crea un temporizator de numărătoare inversă.

Pentru a înțelege acest exemplu, ar trebui să aveți cunoștințele despre următoarele subiecte de programare JavaScript:

  • JavaScript Math etaj ()
  • Data și ora JavaScript
  • Javascript setInterval ()

Exemplu: Creați un temporizator de numărătoare inversă

 // program to create a countdown timer // time to countdown from (in milliseconds) let countDownDate = new Date().getTime() + 24 * 60 * 60 * 1000; // countdown timer let x = setInterval(function() ( // get today's date and time in milliseconds let now = new Date().getTime(); // find the interval between now and the countdown time let timeLeft = countDownDate - now; // time calculations for days, hours, minutes and seconds const days = Math.floor( timeLeft/(1000*60*60*24) ); const hours = Math.floor( (timeLeft/(1000*60*60)) % 24 ); const minutes = Math.floor( (timeLeft/1000/60) % 60 ); const seconds = Math.floor( (timeLeft/1000) % 60 ); // display the result in the element with console.log(days + "d " + hours + "h " + minutes + "m " + seconds + "s "); // clearing countdown when complete if (timeLeft < 0) ( clearInterval(x); console.log('CountDown Finished'); ) ), 2000);

Ieșire

 0d 23h 59m 57s 0d 23h 59m 55s 0d 23h 59m 53s 0d 23h 59m 51s … 

În programul de mai sus, setInterval()metoda este utilizată pentru a crea un cronometru.

setInterval()Metoda este executată la un anumit interval de timp (aici, 2000 milisecunde).

new Date()Dă data și ora curentă. De exemplu,

 let d1 = new Date(); console.log(time); // Fri Aug 28 2020 09:19:40 GMT+0545 (+0545)

getTime()Metoda returnează numărul de milisecunde de la miezul nopții o ianuarie 1970 (EcmaScript epocă) la data specificată (aici, data curentă).

Următorul cod indică ora următoarei în milisecunde.

 new Date().getTime() + 24 * 60 * 60 * 1000;

Acum, putem calcula timpul rămas folosind următoarea formulă:

 let timeLeft = countDownDate - now;

Numărul rămas de zi se calculează folosind:

  • Intervalul de timp este împărțit la 1000 pentru a determina numărul de secunde, adicătimeLeft / 1000
  • Intervalul de timp este apoi împărțit la 60 * 60 * 24 pentru a determina numărul de zile rămase.
  • Math.floor()Funcția este utilizată pentru a rotunji numărul la un număr întreg.

Metode similare sunt folosite ore, minute și secunde.

Notă : Puteți utiliza, de asemenea, un timp de numărătoare inversă personalizat, trecând o anumită dată.

De exemplu,

 let countDownDate = new Date("Aug 5, 2025 14:22:36").getTime();

Articole interesante...