NodeJS

[Javascript] - 카운트다운으로 남은날짜시간 구하기

Riucc 2019. 2. 19. 15:15

○ 카운트다운으로 남은날짜시간 구하기 


// timer.js 

 

 CountDownTimer('12/25/2019', 'countdown');

 CountDownTimer('3/19/2019 5:00 PM', 'HourCountdown');

 CountDownTimer('2/19/2019', 'countExpire');


 function CountDownTimer(dt, id) {

     var end = new Date(dt);


     var _second = 1000;

     var _minute = _second * 60;

     var _hour = _minute * 60;

     var _day = _hour * 24;

     var timer;


     function showRemaining() {

         var now = new Date();

         var distance = end - now;


         // 시간 종료 시 뜨는 문구

         if (distance < 0) {

             clearInterval(timer);

             document.getElementById(id).innerHTML = '카운트다운이 끝났습니다. 곧 오픈합니다!';

             return;

         }

         var days = Math.floor(distance / _day);

         var hours = Math.floor((distance % _day) / _hour);

         var minutes = Math.floor((distance % _hour) / _minute);

         var seconds = Math.floor((distance % _minute) / _second);


         document.getElementById(id).innerHTML = days + '일 ';

         document.getElementById(id).innerHTML += hours + '시간 ';

         document.getElementById(id).innerHTML += minutes + '분 ';

         document.getElementById(id).innerHTML += seconds + '초';

     }

     timer = setInterval(showRemaining, 1000);

 }


// main.html


<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>타이머 테스트</title>

    <script type="text/javascript" src="timer.js"></script>

    <style>

        #countdown,

        #HourCountdown,

        #countExpire {

            display: inline;

            color: blue;

            font-weight: bold;

        }

    </style>

</head>


<body>

    // 아래와 같이 가져와서 사용한다

    2019년 12월 25일까지 <div id="countdown"></div> 남았습니다.<br>

    2019년 3월 19일 5시까지 <div id="HourCountdown"></div> 남았습니다.<br>

    2019년 2월 19일인 오늘 <div id="countExpire"></div>

</body>

</html>