Program JavaScript do tworzenia minutnika

W tym przykładzie nauczysz się pisać program JavaScript, który utworzy licznik czasu.

Aby zrozumieć ten przykład, powinieneś znać następujące tematy programowania JavaScript:

  • JavaScript Math floor ()
  • Data i godzina JavaScript
  • JavaScript setInterval ()

Przykład: utwórz odliczanie czasu

 // 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);

Wynik

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

W powyższym programie setInterval()metoda służy do tworzenia timera.

setInterval()Metoda jest wykonywana w danym przedziale czasu (tutaj 2000 milisekund).

new Date()Daje bieżącą datę i czas. Na przykład,

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

getTime()Metoda zwraca liczbę milisekund od północy 1 stycznia 1970 (ECMAScript epoki) do określonej daty (tu data bieżąca).

Poniższy kod podaje czas następnego dnia w milisekundach.

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

Teraz możemy obliczyć pozostały czas za pomocą następującego wzoru:

 let timeLeft = countDownDate - now;

Pozostała liczba dni jest obliczana na podstawie:

  • Przedział czasu dzieli się przez 1000, aby określić liczbę sekund, tjtimeLeft / 1000
  • Następnie przedział czasu dzieli się przez 60 * 60 * 24 w celu określenia liczby pozostałych dni.
  • Math.floor()Funkcja służy do zaokrąglić liczbę do liczby całkowitej.

Podobne metody są używane dla godzin, minut i sekund.

Uwaga : możesz również użyć niestandardowego czasu odliczania początkowego, podając określoną datę.

Na przykład,

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

Interesujące artykuły...