<!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'
效果如下: