JavaScript만 사용하여 간단한 카운트다운 타이머를 만드는 방법은 무엇입니까?-JS 튜토리얼-php.cn

JavaScript만 사용하여 간단한 카운트다운 타이머를 만드는 방법은 무엇입니까?

Mary-Kate Olsen

풀어 주다： 2024-12-03 22:31:16

원래의

599명이 탐색했습니다.

How to Create a Simple Countdown Timer Using Only JavaScript?

JavaScript로 단순한 카운트다운 타이머 만들기

웹사이트에 간단한 카운트다운 타이머를 설정하려는 경우 "05:00"에서 " 00:00'이라고 표시됩니다. 더 이상 보지 마세요. 이 기사에서는 복잡한 Date 객체를 사용하지 않고 최고의 단순성을 보장하는 효율적인 솔루션을 제공합니다.

JavaScript 전용 타이머

function startTimer(duration, display) {
  var timer = duration, minutes, seconds;
  setInterval(function () {
    minutes = parseInt(timer / 60, 10);
    seconds = parseInt(timer % 60, 10);

    minutes = minutes < 10 ? "0" + minutes : minutes;
    seconds = seconds < 10 ? "0" + seconds : seconds;

    display.textContent = minutes + ":" + seconds;

    if (--timer < 0) {
      timer = duration;
    }
  }, 1000);
}

window.onload = function () {
  var fiveMinutes = 60 * 5,
    display = document.querySelector('#time');
  startTimer(fiveMinutes, display);
};

로그인 후 복사

HTML 구조:

<body>
  <div>Registration closes in <span>

로그인 후 복사

위 내용은 JavaScript만 사용하여 간단한 카운트다운 타이머를 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!