基于JS代碼實現簡單易用的倒計時 x 天 x 時 x 分 x 秒效果
更新時間：2017年07月13日 09:15:42 作者：九轉十指
這篇文章主要介紹了基于JS代碼實現簡單易用的倒計時 x 天 x 時 x 分 x 秒效果,需要的朋友可以參考下
廢話不多說了，直接給大家貼代碼了，具體代碼如下所示：
<script>
(function () {
var tian = document.getElementsByClassName('JS-tian')[0];
var shi = document.getElementsByClassName('JS-shi')[0];
var fen = document.getElementsByClassName('JS-fen')[0];
var miao = document.getElementsByClassName('JS-miao')[0];
var endTime = new Date('2117/07/12 23:59:59').getTime() + 1000;
var interval = null;
interval = setInterval(function () {
var syhm = endTime - Date.now(); // 剩余毫秒
if (syhm >= 0) {
tian.innerText = Math.floor(syhm / 1000 / 60 / 60 / 24);
shi.innerText = Math.floor(syhm / 1000 / 60 / 60 % 24);
fen.innerText = Math.floor(syhm / 1000 / 60 % 60);
miao.innerText = Math.floor(syhm / 1000 % 60);
} else {
clearInterval(interval);
}
}, 0);
})();
</script>
htmlDemo:
<div> 距結束還剩：<span class="JS-tian"></span>天<span class="JS-shi"></span>時<span class="JS-fen"></span>分<span class="JS-miao"></span>秒 </div>
以上所述是小編給大家介紹的基于JS代碼實現簡單易用的倒計時 x 天 x 時 x 分 x 秒效果，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！
相關文章
這篇文章主要介紹了flexible.js實現移動端rem適配方案，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-04-04
這篇文章主要介紹了JavaScript中判斷函數、變量是否存在,本文給出了多個判斷函數是否存在的方法,并分別給出代碼實例,需要的朋友可以參考下2015-06-06
這篇文章主要介紹了超輕量級的js時間庫miment使用解析,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-08-08
這篇文章主要為大家詳細介紹了基于javascript實現表格的簡單操作，具有一定的參考價值，感興趣的朋友可以參考一下2016-05-05
這篇文章主要介紹了js replace替換所有匹配的字符串,需要的朋友可以參考下2014-02-02
這篇文章主要介紹了移動端吸頂fixbar的解決方案詳解,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-07-07
這篇文章主要為大家詳細介紹了js實現滾動條自動滾動，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-12-12
Webpack devServer中的 proxy 實現跨域的解決
這篇文章主要介紹了Webpack devServer中的 proxy 實現跨域的解決，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-06-06
表單無刷新提交帶驗證，非常適用于反饋，具體的實現如下包含各個功能代碼，喜歡的朋友可以參考下2013-11-11
這篇文章主要介紹了JavaScript中?Promise?的使用技巧，文章圍繞主題展開詳細的內容介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-08-08