倒计时

一、原理

/*Date() ---- 用来获取事件的对象*/
/*getTime() ---- 用到获取从1970年1月1日凌晨8点开始算起的毫秒数*/
var date0 = new Date();
console.log(date0);//什么都不填的情况下，获取到此时的星期、月份、年份、日期、时、分、秒
console.log(date0.getTime());//什么都不填的情况下，获取的是当前时间到（中国-东八区）的毫秒数

setInterval(function(){},1000);//每隔1秒执行一次函数

注意：

• 1、Date()函数可以传入具体的时间，来获取你想要得到的一个时间。
• 2、在js中月份需要减1个月算起！。

---

二、JS实现代码

这里现在html中给一个div放 倒计时:

var date2 = new Date(2019,5,25,10,14,40,1000);//设置一个终止日期(注:月份要减掉1个月，即是2019年6月25日10时14分40秒1000毫秒)
var ms1 = date2.getTime();//获取date2距离1970年的毫秒数
//封装一个函数（参数 ms,type的值可变）
function daojishi(ms,type){//ms表示设置的时间，type表示时间输出的格式
    var date1 = new Date();
    var curTime = date1.getTime();//获取一个当前时间距离1970年的毫秒数
    var timeLag = ms - curTime;//当前时间 距离 设置时间的毫秒数
    //转为 时间单位格式
    timeLag = Math.floor(timeLag/1000); //毫秒转化为秒 并且 取整 省略精确值
    if(timeLag<=0){
        clearInterval(intervalTime);//清除定时器
        return "剩余："+00+"天"+00+"时"+00+"分"+00+"秒";//判断如果小于当前时间则变0 --把下面的格式也可以代入这个判断，这里就不写了
    }
    var day = Math.floor(timeLag/24/60/60);//换算剩余 天数 取整
    var h = Math.floor(timeLag/(60*60)%24);//换算剩余 时数 取整
    var m = Math.floor(timeLag/60%60);//换算剩余 分钟数 取整
    var s = Math.floor(timeLag%60);//换算剩余 秒数 取整
    //个数补零，用三目运算符设置成00格式
    h = h>=10?h:"0"+h;
    m = m>=10?m:"0"+m;
    s = s>=10?s:"0"+s;
    //设置返回格式模板
    if(type == "/"){
        return "剩余： "+day+"天"+h+"小时"+m+"分钟"+s+"秒!";//设置输出格式1
    }else if(type == ":"){
        return "剩余： "+day+"天"+h+":"+m+":"+s;//设置输出格式2
    }else{
        return "剩余： "+day+"天"+h+"时"+m+"分"+s+"秒";//设置输出格式3
    }
}
//获取装倒计时的div
var timeBox = document.querySelector(".time");
//下面两句复写一个倒计时函数：是为了在刷新页面是直接显示倒计时，否则会在1秒后才在页面中显示出来
var timer = daojishi(ms1,"");//""输出的是时间格式3
timeBox.innerText = timer;
            
//设置每隔1秒，更新时间（通过改变盒子的innerText）
var intervalTime = setInterval(function(){
    var timer = daojishi(ms1,"");
    timeBox.innerText = timer;
},1000)

---

三、效果展示

image.png