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

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>

<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>

저작자표시