1. 程式人生 > 實用技巧 >js倒計時|天時分秒| countTime

js倒計時|天時分秒| countTime

js

const endTimeObj = new Date("2020-5-1");
function countTime() {
  //時間差
  var leftTime = endTimeObj - new Date();
  //定義變數 d,h,m,s儲存倒計時的時間
  var d, h, m, s;
  if (leftTime < 0) {
    return;
  }
  d = Math.floor(leftTime / 1000 / 60 / 60 / 24);
  h = Math.floor((leftTime / 1000 / 60 / 60) % 24);
  m = Math.floor((leftTime / 1000
/ 60) % 60); s = Math.floor((leftTime / 1000) % 60); const str = `${d}天${h}時${m}分${s}秒`; setTimeout(countTime, 1000); console.log(str); //將倒計時賦值到div中 //遞迴每秒呼叫countTime方法,顯示動態時間效果 } countTime();

html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>倒計時</title>
  </head>
  <body>
    <script type="
text/javascript"> const endTimeObj = new Date("2020-5-1"); function countTime() { //時間差 var leftTime = endTimeObj - new Date(); //定義變數 d,h,m,s儲存倒計時的時間 var d, h, m, s; if (leftTime < 0) { return; } d = Math.floor(leftTime / 1000 / 60
/ 60 / 24); h = Math.floor((leftTime / 1000 / 60 / 60) % 24); m = Math.floor((leftTime / 1000 / 60) % 60); s = Math.floor((leftTime / 1000) % 60); const str = `${d}天${h}時${m}分${s}秒`; setTimeout(countTime, 1000); console.log(str); //將倒計時賦值到div中 //遞迴每秒呼叫countTime方法,顯示動態時間效果 } countTime(); </script> </body> </html>