js:Date对象,倒计时封装('2019/11/11 00:00:00'到当前时间的毫秒数)-CSDN博客

<body>
  <h3 id="title"></h3>
  <script>
    // 时间字符串
    // var targetDate = '2019/11/11 00:00:00'

    // 将字符串格式化为日期对象
    // var d = new Date(targetDate)
    // Mon Nov 11 2019 00:00:00 GMT+0800 (中国标准时间)
    
    // var targetDate = '2019/01/10 00:00:00'

    function countTime(targetStr) {
       // 将时间字符串转换为时间对象
       var targetDate = new Date(targetStr)

       // 当前时间对象
       var currentDate = new Date()
      
       // 毫秒差 = 目标时间 - 当前时间
       var diffTime = targetDate - currentDate
       console.log('diffTime', diffTime)

       // 活动结束时 清除定时器
       if (diffTime <= 0) {
         window.clearInterval(timer)
         return '本次活动已结束 sorry!'
       }

       // 毫秒换算成秒
       diffTime = diffTime / 1000

       var convertDay = 60 * 60 * 24
       var convertHour = 60 * 60
       // 天
       var day = Math.floor(diffTime / convertDay)
      //  console.log(day)

       // 总秒差 / 一天秒数 剩下的余数
       diffTime = diffTime % convertDay
       
       // 小时
       var hour = Math.floor(diffTime / convertHour)
       // 换算成小时后 剩余的秒数
       diffTime = diffTime % convertHour
      //  console.log(hour)

       // 分钟
       var minutes = Math.floor(diffTime / 60)
       // 换算成分钟后 剩余的秒数
       diffTime = diffTime % 60
      //  console.log(minutes)

       // 秒
       var seconds = Math.floor(diffTime)
      //  console.log(seconds)

      // 几天几小时几分几秒
      return `${addZero(day)}天${addZero(hour)}小时${addZero(minutes)}分${addZero(seconds)}秒`
    }

    var title = document.getElementById('title')
    
    var timer = window.setInterval(function() {
      console.log('定时器')
      title.innerHTML = countTime('2019/01/11 00:00:00')
    }, 1000)

    // 不够10的数 补零
    function addZero(val) {
      return val < 10 ? '0' + val : val
    }

    // ES6 模板字符串
    var a = 'Hello'
    var b = 'World'

    // 字符串中拼接变量
    var str = `他说 ${a} ${b}`
    // console.log(str) // '他说 Hello World'
  </script>
</body>
复制代码

自己带标注版

<h3 id="title"></h3>
    <script>
        // 时间字符串
        // var targetDate='2019/11/11 00:00:00';

        // //将字符串格式化为日期对象
        // var d=new Date(targetDate);
        // console.log(d);//Mon Nov 11 2019 00:00:00 GMT+0800 (中国标准时间)
        
        // var targetDate='2019/01/10 00:00:00';

        function countTime(targetStr){
             var targetDate=new Date(targetStr);
             // console.log(targetDate)//返回的是目标对象Fri Jan 11 2019 00:00:00 GMT+0800 (中国标准时间)
             var currentDate=new Date();
             console.log(currentDate);//返回的是当前的时间对象Tue Jan 08 2019 20:07:03 GMT+0800 (中国标准时间)

             // 目标时间-当前时间=两者相减的毫秒数
             var diffTime=targetDate-currentDate;
             // console.log(diffTime);//返回的是毫秒数186429968

             var diffTime=diffTime/1000;
             // console.log(diffTime);//返回的是秒数186429.968

             var convertDay=60*60*24;
             var convertHour=60*60;
             // 天
             // var day=Math.floor(diffTime/60/60/24)
                var day=Math.floor(diffTime/convertDay);
               // console.log(day);//返回倒计时的天数
               // 总秒差/一天的秒数 剩下天的余数
               diffTime=diffTime%convertDay;
               // 小时
               var hour=Math.floor(diffTime/convertHour);
               // console.log(hour);返回的倒计时的小时数
               // 换算成小时候  剩余的秒数
               diffTime=diffTime%convertHour;
               // 分钟
               var minutes=Math.floor(diffTime/60);
               // console.log(minutes);返回倒计时的分钟数
               // 换算成分钟后  剩余的秒数
               diffTime=diffTime%60;
               // 秒
               var seconds=Math.floor(diffTime);
               // console.log(seconds);返回倒计时的秒数

               // 几天几小时几分几秒
               return `${addZero(day)}天${addZero(hour)}小时${addZero(minutes)}分${addZero(seconds)}秒`
        }
        var title=document.getElementById('title');

        var timer=setInterval(function(){
            console.log('定时器')
            title.innerHTML=countTime('2019/01/11 00:00:00')
        },1000)

        function addZero(val){
            return val<10?'0'+val:val;
        }
      
    </script>
复制代码