<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>JS实现倒计时</title>
<style>
*{ margin:0; padding:0; list-style:none;}
body{ font-size:18px; text-align:center;}
.time{ height:30px; padding:200px;}
</style>
</head>
<body>
<div class="time">
<span id="showInterval"></span>
</div>
<script>
function getDistanceTime(time,showInterval){
var endTime= new Date(Date.parse(time.replace(/-/g, "/")));/*replace将时间字符串中所有的‘-‘替换成‘/‘,parse将时间格式的字符串转换成毫秒*/
var nowTime = new Date();
var distance =endTime.getTime() - nowTime.getTime();/*getTime把一个date对象转换成毫秒*/
var day = 0;
var hour = 0;
var minute = 0;
var second = 0;
if(distance >= 0){
day = Math.floor(distance/1000/60/60/24);
hour = Math.floor(distance/1000/60/60%24);
minute = Math.floor(distance/1000/60%60);
second = Math.floor(distance/1000%60);
}else{
alert("目标日期小于当前日期!")
}
document.getElementById(showInterval).innerHTML = day + "天" + hour + "时" + minute + "分" + second + "秒";
}
// setInterval(function(){getDistanceTime(‘2016/05/19 12:00:00‘,‘showInterval‘);},0);
setInterval(function(){getDistanceTime(‘2017-05-19 12:00:00‘,‘showInterval‘);},0);
</script>
</body>
</html>
传入的日期参数格式,也可以是‘2017/05/19 12:00:00‘
效果如下:
时间： 2024-10-29 21:02:56