应使用 setTimeout 动态计算下个整秒时刻而非 setInterval，避免延迟累积；格式化需手动补零并映射星期，禁用 toLocaleTimeString()；监听页面可见性，后台恢复时立即刷新时间。
直接用 setInterval + Date 就能跑起来，但不处理时区、不防抖、不清理定时器，上线后大概率出问题。
为什么 setInterval(updateTime, 1000) 会慢半拍或跳秒
浏览器的定时器不是精确到毫秒级的调度器，setInterval 只保证「至少间隔 1000ms 才执行下一次」，实际执行可能延迟几十毫秒。连续多次延迟叠加，就会明显看到秒数“卡住”或“跳两下”。
- 别用
setInterval(() => { ... }, 1000)硬等一秒，改用「计算下次触发时间」的方式对齐系统时钟 - 每次更新前先算出下个整秒时刻（比如当前是
17:41:23.842，就设setTimeout在17:41:24.000触发） - 示例逻辑：
function tick() { const now = new Date(); const msToNextSecond = 1000 - now.getMilliseconds(); document.getElementById('clock').textContent = now.toLocaleTimeString(); setTimeout(tick, msToNextSecond); } tick();
toLocaleTimeString() 在不同设备上显示格式不一致
这个方法依赖用户操作系统语言和区域设置，中文 Win10 显示 "下午5:41:23"，英文 macOS 可能是 "5:41:23 PM"，甚至有些旧安卓 WebView 直接返回空字符串。
- 生产环境别依赖
toLocaleTimeString()做格式化，自己拼字符串更可控 - 月份、日期、小时都要手动补零：
String(date.getDate()).padStart(2, '0') - 星期几建议用数组映射，别用
getDay()直接拼文字（避免中英文混用或翻译缺失）
页面切到后台时，setInterval 会被节流甚至暂停
Chrome、Firefox 对非活跃标签页会把 setInterval 最低限制在 1s 以上，Safari 更激进——后台超过 30 秒，定时器可能完全停摆，切回来时时间直接跳变。
立即学习“前端免费学习笔记（深入）”；
- 不要假设定时器一定每秒跑一次；每次更新都应基于
new Date()实时取值，而不是靠计数器累加 - 可监听
visibilitychange事件，在页面重新可见时立刻刷新一次时间，避免跳秒感 - 代码片段：
document.addEventListener('visibilitychange', () => { if (!document.hidden) { updateTime(); // 立即重置显示 } });
真正难的不是“怎么让时间动起来”，而是“怎么让它动得准、动得稳、动得不露馅”——补零逻辑漏一位、没处理 12/24 小时制切换、忽略页面隐藏状态，都会在某个用户那里突然崩掉。
