簡單倒計時實現，精確到到天，時，分，秒，具體可自行設定
阿新 • • 發佈：2019-02-15
歡迎來到Altaba 的部落格
不廢話，直接上程式碼，程式碼雖然簡單，能給讀者帶來點絲毫的便利也是好的。
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>倒計時實現</title> <style> .ddd{ width: 700px; height: 100px; margin: 100px auto; text-align: center; font-size: 30px; color: red; } </style> <script> window.onload=function(){ var box=document.getElementById("box"); var endDate=new Date("2017/1/24 18:30:00");設定結束時間 /*console.info(endDate); console.info(date);*/ var endtime=endDate.getTime(); getTime() 方法可返回距 1970 年 1 月 1 日之間的毫秒數。 window.setInterval(fun,1000); 此處是個計時器，已設定每一秒執行一次fun函式 function fun(){ var date=new Date(); var nowtime=date.getTime(); var allTime=parseInt((endtime-nowtime)/1000);此差值用來計算剩餘時間 //console.info(allTime); var d=parseInt(allTime/3600/24); var h=parseInt(allTime/3600%24); var m=parseInt(allTime/60%60); var s=parseInt(allTime%60); d<10 ? d="0"+d : d; h<10 ? h="0"+h : h; m<10 ? m="0"+m : m; s<10 ? s="0"+s : s; box.innerHTML="現在開始倒計時:"+d+"天"+h+"時"+m+"分"+s+"秒"; } } </script> </head> <body> <h2 style="text-align: center; font-size: 35px">距離放假倒計時！</h2> <div id="box" class="ddd"></div> </body> </html>
