1.原理:
倒计时=现在的时间点(new Date())-固定的时间点(new Date(//这里填固定的时间));
最后将差值转换为想要的格式;
使用setInterval(fn,1000); //1000为每一秒执行一次
2.首先定义:
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
再设置css样式:
.b {
width: 80px;
height: 100px;
border: 1px solid silver;
float: left;
margin: 10px 10px;
text-align: center;
line-height: 100px;
}
JS代码:
var b = document.getElementsByClassName("b");
//定义一个固定时间
var timgo = new Date("2019 03-03 00:00:00");
var timnow = setInterval(function () {
var localtime = new Date();
/*getTime() 获取当前时间到1970总毫秒数*/
var timeres = timgo.getTime() - localtime.getTime();
var sec = parseInt(timeres / 1000);
var secth = sec % 60;
var minth = parseInt(sec / 60) % 60;
var houth = parseInt(sec / (60 * 60)) % 24;
var datth = parseInt(sec / (60 * 60 * 24)) % 31;
var month = parseInt(sec / (60 * 60 * 24 * 31)) % 12;
var yearth = parseInt(sec / (60 * 60 * 24 * 31 * 12)) % 100;
b[0].innerHTML = yearth + "年";
b[1].innerHTML = month + "月";
b[2].innerHTML = datth + "日";
b[3].innerHTML = houth + "时";
b[4].innerHTML = minth + "分";
b[5].innerHTML = secth + "秒";
var hao = (timeres % 1000);
var res = "";
if (hao < 10) {
res = "00" + hao;
}
else if (hao >= 10 && hao < 100) {
res = "0" + hao;
}
else {
res = hao;
}
b[6].innerHTML = res + "毫秒";
}, 1);
效果如图: