倒计时js代码块

控制台可回车执行// 初始时间秒let jzsj 60; // 设置初始时间这里以60秒为例function startCountdown(duration) {let secondsRemaining duration;const interval setInterval(() {if (secondsRemaining 0) {clearInterval(interval);console.log(时间到);} else {console.log(${secondsRemaining} 秒剩余);secondsRemaining--;}}, 1000); // 每秒更新一次}// 开始倒计时startCountdown(jzsj);倒计时JS代码块实现方法基础倒计时功能实现以下代码实现一个从指定时间开始的倒计时功能显示剩余的天、小时、分钟和秒function countDown(targetDate, elementId) { const timer setInterval(() { const now new Date().getTime(); const distance targetDate - now; const days Math.floor(distance / (1000 * 60 * 60 * 24)); const hours Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); const minutes Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); const seconds Math.floor((distance % (1000 * 60)) / 1000); document.getElementById(elementId).innerHTML ${days}d ${hours}h ${minutes}m ${seconds}s; if (distance 0) { clearInterval(timer); document.getElementById(elementId).innerHTML EXPIRED; } }, 1000); } // 使用示例倒计时至2024年12月31日 countDown(new Date(2024-12-31).getTime(), countdown);页面加载自动启动倒计时在HTML中放置显示容器后自动启动div idcountdown/div script window.onload function() { countDown(new Date(2024-12-31).getTime(), countdown); }; /script带样式的倒计时显示通过CSS增强视觉效果#countdown { font-family: Arial; font-size: 2rem; color: #ff5722; text-align: center; padding: 20px; background: #f5f5f5; border-radius: 5px; }支持多倒计时实例改进后的函数支持页面多个倒计时区域function multiCountDown(targetDate, elementId, expiredText EXPIRED) { const formatTime (t) t 10 ? 0${t} : t; const timer setInterval(() { const now new Date().getTime(); const distance targetDate - now; const days Math.floor(distance / (1000 * 60 * 60 * 24)); const hours formatTime(Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))); const minutes formatTime(Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60))); const seconds formatTime(Math.floor((distance % (1000 * 60)) / 1000)); document.getElementById(elementId).innerHTML span classdays${days}/spand span classhours${hours}/spanh span classmins${minutes}/spanm span classsecs${seconds}/spans; if (distance 0) { clearInterval(timer); document.getElementById(elementId).innerHTML span classexpired${expiredText}/span; } }, 1000); }跨年倒计时处理自动处理年份更替的长期倒计时function annualCountDown(month, day, elementId) { const now new Date(); let targetYear now.getFullYear(); const targetDate new Date(targetYear, month-1, day); if (now targetDate) { targetDate.setFullYear(targetYear 1); } countDown(targetDate.getTime(), elementId); } // 示例每年圣诞节倒计时 annualCountDown(12, 25, christmasCountdown);