推荐用 setTimeout 递归调用，每次基于 Date.now() 动态计算剩余毫秒数，避免 setInterval 因页面失焦、节流或卡顿导致的时间漂移和累积误差。
倒计时用 setInterval 还是 setTimeout？
直接用 setInterval 最简单，但容易因页面失焦、JS 执行延迟或重绘卡顿导致时间漂移。更稳的做法是：用 setTimeout 递归调用 + 每次计算**目标时间与当前时间的毫秒差**，避免累积误差。
- 每次
setTimeout都基于Date.now()动态算剩余毫秒数，不依赖“每秒执行一次”的假设 -
setInterval在页面后台运行时可能被浏览器节流（尤其 Chrome），实际回调间隔拉长到 1s 以上 - 倒计时结束必须手动
clearTimeout或clearInterval，否则内存泄漏 + 逻辑错乱
HTML 结构怎么写才方便 JS 控制？
不要用多个独立 手动更新天/时/分/秒——DOM 操作多、易出错、不方便响应式。推荐单个容器 + 内联格式化：
- JS 只需更新
document.getElementById('countdown').textContent一次 - 格式化逻辑（如补零、隐藏零值）全在 JS 里控制，比如
String(5).padStart(2, '0') - 若需单独样式某一位（如秒红色），再拆成
，但初始结构仍建议扁平
倒计时结束时常见错误有哪些？
最常踩的坑不是逻辑写错，而是「以为时间到了就停，其实没清定时器」或「DOM 元素已不存在还试图更新」：
- 倒计时为 0 后未调用
clearTimeout(timerId)，后续仍会触发回调（哪怕内容不再变化） - 用户刷新页面或跳转前没清理，
setTimeout回调在新页面执行，报Cannot set property 'textContent' of null - 目标时间写成字符串（如
"2025-06-01"）没转Date，导致NaN，所有计算失效 - 时区搞错：服务器时间 vs 本地时间。前端倒计时一律用
new Date(targetTimeStr)解析，它默认按本地时区处理
一个可直接复制的最小可用示例
以下代码支持任意未来时间点，自动格式化为 00天 00:00:00，结束时显示 已结束 并停止：
立即学习“Java免费学习笔记（深入）”；
const targetTime = new Date('2025-06-01T00:00:00'); // 替换为你的时间
const el = document.getElementById('countdown');
function updateCountdown() {
const now = Date.now();
const diffMs = targetTime - now;
if (diffMs <= 0) {
el.textContent = '已结束';
return;
}
const days = Math.floor(diffMs / (1000 60 60 24));
const hours = Math.floor((diffMs % (1000 60 60 24)) / (1000 60 60));
const minutes = Math.floor((diffMs % (1000 60 60)) / (1000 60));
const seconds = Math.floor((diffMs % (1000 60)) / 1000);
el.textContent = ${days}天 ${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')};
}
let timerId = setTimeout(updateCountdown, 100); // 首次延迟 100ms，避免首帧卡顿
注意：targetTime 必须是有效 Date 实例；如果从后端传时间，确保格式是 ISO 8601（如 "2025-06-01T12:00:00+08:00"），别用 "2025/06/01" 这种非标准写法——Safari 会解析失败。
