标签：活动 class sed gif 定时器 倒数 结束 select onclick
计算当前时间
var nowTime = new Date();
设置 结束时间
var endTime = new Date("2020/07/28,17:57:00");
计算剩余的全部 毫秒数
var leftTime = parseInt( (endTime.getTime() - nowTime.getTime()) / 1000 );
计算天、时、分、秒
var d = parseInt(leftTime / (24 * 60 * 60)); var h = parseInt((leftTime / (60 * 60)) % 24); var m = parseInt((leftTime / 60) % 60); var s = parseInt(leftTime % 60);
渲染
1 document.querySelector( 2 ".count" 3 ).innerHTML = `活动倒计时 ${d}天 ${h} 时 ${m} 分 ${s} 秒`; 4 // 如果 全部毫秒数 小于等于0 提示活动结束 5 if (leftTime <= 0) { 6 document.querySelector(".count").innerHTML = "活动已结束"; 7 return; 8 }
注意 当倒数的数到10一下的时候，要进行补零处理
1 function addZero(i) { 2 return i < 10 ? "0" + i : i + ""; 3 } 4 5 // 不足两位进行补零 6 d = addZero(d); 7 h = addZero(h); 8 m = addZero(m); 9 s = addZero(s);
进行封装放在定时器里执行（或者计时器中）
setTimeout(countDown, 1000);
1 html： 2 <div class="count"></div> 3 4 js 5 window.onload = function () { 6 countDown(); 7 // 十以下的数进行补0 8 function addZero(i) { 9 return i < 10 ? "0" + i : i + ""; 10 } 11 12 function countDown() { 13 // 计算当前时间 14 var nowTime = new Date(); 15 // 计算 结束时间 16 var endTime = new Date("2020/07/28,17:57:00"); 17 // 剩余的全部 毫秒数 18 var leftTime = parseInt( 19 (endTime.getTime() - nowTime.getTime()) / 1000 20 ); 21 // 计算 天、时、分、秒 22 var d = parseInt(leftTime / (24 * 60 * 60)); 23 var h = parseInt((leftTime / (60 * 60)) % 24); 24 var m = parseInt((leftTime / 60) % 60); 25 var s = parseInt(leftTime % 60); 26 // 不足两位进行补零 27 d = addZero(d); 28 h = addZero(h); 29 m = addZero(m); 30 s = addZero(s); 31 32 document.querySelector( 33 ".count" 34 ).innerHTML = `活动倒计时 ${d}天 ${h} 时 ${m} 分 ${s} 秒`; 35 // 如果 全部毫秒数 小于等于0 提示活动结束 36 if (leftTime <= 0) { 37 document.querySelector(".count").innerHTML = "活动已结束"; 38 return; 39 } 40 setTimeout(countDown, 1000); 41 } 42 };
标签：活动 class sed gif 定时器 倒数 结束 select onclick
原文地址：https://www.cnblogs.com/leoragelovexer/p/13347900.html
