Membuat Countdown Timer dengan JavaScript

JavaScript adalah bahasa pemrograman yang populer digunakan oleh pengembang website. Salah satu kegunaannya adalah membuat website yang interaktif. Bahasa ini juga dapat membantu HTML dalam proses pengelolaan file maupun menggunakan modul-modul lainnya.

Di bawah ini adalah contoh kode JavaScript yang digunakan untuk membuat countdown timer menggunakan JavaScript dengan sederhana. Variabel countDownDate adalah waktu berakhirnya waktu countdown.

<p id="demo"></p>
<script>
// Mengatur waktu akhir perhitungan mundur
var countDownDate = new Date("Dec 5, 2019 15:37:25").getTime();

// Memperbarui hitungan mundur setiap 1 detik
var x = setInterval(function() {

  // Untuk mendapatkan tanggal dan waktu hari ini
  var now = new Date().getTime();
    
  // Temukan jarak antara sekarang dan tanggal hitung mundur
  var distance = countDownDate - now;
    
  // Perhitungan waktu untuk hari, jam, menit dan detik
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);
    
  // Keluarkan hasil dalam elemen dengan id = "demo"
  document.getElementById("demo").innerHTML = days + "d " + hours + "h "
  + minutes + "m " + seconds + "s ";
    
  // Jika hitungan mundur selesai, tulis beberapa teks 
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }
}, 1000);
</script>
Tampilan countdown timer di atas kurang lebih seperti di bawah ini: