分享一個js實作倒數計時的關鍵程式碼

這篇文章主要為大家詳細介紹了js實現倒數計時的關鍵程式碼，具有一定的參考價值，有興趣的小夥伴們可以參考一下

我們常常會在有些電商網站上看到秒殺倒數計時,雙11倒數計時.其實倒數計時的效果實現起來也是很簡單的,並不復雜.

首先呢,開始寫之前一定要理清楚思路,思路清晰了,那寫起來就容易多了,下面我分了幾個步驟:

#1.獲取當前的時間,並且定義結束的時間

#2.用求未來時間和當前時間的時間差,並且求出時分秒

3.設定定時器,讓時間每秒遞減

var p = document.getElementsByTagName("p")[0];
      var timer = setInterval(timers, 1000);
      function timers() {
        //获取现在的时间
        var now = new Date();
        //获取你想要的未来时间
        var future = new Date("2017/05/10");
        var time = future.getTime() - now.getTime();
        //获取距离的天数
        var day = parseInt(time / 24 / 60 / 60 / 1000);
        //获取距离的小时
        var hour = parseInt(time / 1000 / 60 / 60 % 24);
        //获取分
        var minute = parseInt(time / 1000 / 60 % 60);
        //获取秒
        var sec = parseInt(time / 1000 % 60);
        if(time < 0) {
          p.innerHTML = "距离苹果发布会还有00天00小时00分00秒000毫秒";
          clearInterval(timer);
          return;
        }
        //注意点:当时间小于10的时候,要在前面补0
        p.innerHTML = "距离结束时间还有" + (day < 10 ? ("0" + day) : day) + "天" + (hour < 10 ? ("0" + hour) : hour) + "小时" + (minute < 10 ? ("0" + minute) : minute) + "分" + (sec < 10 ? ("0" + sec) : sec) + "秒";
      }

【相關推薦】

1. 免費js線上影片教學

2. JavaScript中文參考手冊

3. php.cn獨孤九賤（3）－ JavaScript影片教學

以上是分享一個js實作倒數計時的關鍵程式碼的詳細內容。更多資訊請關注PHP中文網其他相關文章！