<p>应使用 setTimeout 而非 setInterval；因 setInterval 易导致飘秒、累积误差及切后台后跳秒或卡住，可靠方案是每次用 setTimeout 动态计算下一次触发时间，基于 targetTime - Date.now() 实时更新剩余毫秒。</p>
倒计时牌用 setInterval 还是 setTimeout？
用 setInterval 容易飘秒、累积误差，尤其页面切后台再切回来时可能跳秒或卡住。真正可靠的方案是每次用 setTimeout 动态计算下一次触发时间——基于当前时间与目标时间的差值，而不是固定 1000ms 循环。
- 每次渲染前重新算剩余毫秒：
const remaining = targetTime - Date.now() - 如果
remaining ，直接停掉计时器并显示“已结束” - 否则设
setTimeout，延迟时间为remaining % 1000（取余确保对齐自然秒）
HTML 结构怎么写才方便 JS 控制？
别用一堆独立 <span> 硬编码天/时/分/秒，也不要用 CSS Grid 做复杂布局——容易被 JS 更新打乱。最稳的是单个容器配语义化子元素：
<div id="countdown"> <span class="unit" data-unit="days">0</span>天 <span class="unit" data-unit="hours">00</span>时 <span class="unit" data-unit="minutes">00</span>分 <span class="unit" data-unit="seconds">00</span>秒 </div>
这样 JS 只需查 document.querySelectorAll('.unit')，按 data-unit 属性更新对应值，加零补位也统一处理。
时区问题不处理，上线就翻车
用户本地时间 ≠ 活动截止时间。比如活动定在「2024-10-01T00:00:00+08:00」，但用 new Date('2024-10-01') 在欧美用户浏览器里会按当地时间解析，偏差可达十几个小时。
立即学习“前端免费学习笔记（深入）”；
- 后端必须返回带时区的 ISO 时间字符串，例如：
"2024-10-01T00:00:00+08:00" - 前端直接传给
new Date()，它能正确解析偏移量 - 绝对不要用
new Date(2024, 9, 1)这类构造函数——月份从 0 开始且默认本地时区
页面隐藏时倒计时还在跑？
用户切到其他标签页，setTimeout 实际延迟会被浏览器节流（可能变成 1s→4s），导致倒计时“慢放”。要主动监听页面可见性：
- 监听
document.visibilityState变化 - 不可见时清除定时器，可见时重新计算剩余时间并启动
- 关键判断：用
Date.now()而不是依赖上次更新的时间戳，避免误差放大
真实场景里，用户可能离开半小时再回来——这时候直接跳到最新状态，比强行“追帧”更合理。
