time.html
<!doctype html>
<html >
<head>
<meta charset="UTF-8">
<title>京东倒计时抢购</title>
<style>
*{
margin:0;
padding:0;
font-size:20px;
}
.box{
text-align:center;
margin:20px auto;
width:300px;
height:50px;
line-height:50px;
border:1px solid red;
}
.box span{
color:yellow;
font-weight:bold;
}
</style>
</head>
<body>
<div class="box">距离开抢还有：<span id="timeBox">00:00:00</span></div>
<script src="time.js" charset="utf-8"></script>
</body>
</html>
time.js
var timeBox=document.getElementById('timeBox');
function computed(){
var nowTime=new Date(),
targetTime=new Date('2019/3/1 16:00:00');
var spanTime=targetTime-nowTime;
if(spanTime<=0){
timeBox.innerHTML="开始抢购";
window.clearInterval(timer);
return;
}
var hour=Math.floor(spanTime/(1000*60*60));
spanTime-=hour*1000*60*60;
var minute=Math.floor(spanTime/(1000*60));
spanTime-=minute*1000*60;
var second=Math.floor(spanTime/1000);
hour<10?hour="0"+hour:null;
minute<10?minute="0"+minute:null;
second<10?second="0"+second:null;
timeBox.innerHTML=hour+":"+minute+":"+second;
}
computed();
var timer=window.setInterval(computed,1000);;