直接用Date+setInterval可实现纯前端倒计时，但需确保DOM加载完成再执行，且getMonth()返回0–11需+1，所有时间字段用padStart(2,'0')补零防NaN。
直接用 Date 对象 + setInterval 就能跑起来，不需要框架、不依赖服务器，但必须注意 DOM 加载时机和字符串补零这类细节，否则页面一打开就报错或显示 “NaN-NaN-NaN”。
为什么 document.getElementById 会返回 null
常见错误是脚本在 HTML 元素还没解析完时就执行了，比如把 <script> 放在 <head> 里又没加监听逻辑。
- 最稳妥做法：把
<script>标签放在</body>前面 - 或者用
DOMContentLoaded包一层：document.addEventListener('DOMContentLoaded', () => { /* 你的代码 */ }); - 别用
window.onload——它等所有资源（图片、CSS）加载完才触发，延迟明显
getMonth() 和 getDate() 返回值容易搞错
getMonth() 返回的是 0–11（不是 1–12），getDate() 是 1–31 没问题；但两者都可能是个位数，直接拼接会导致 “2026-8-26 10:7:5” 这种格式。
- 月份要手动加 1：
now.getMonth() + 1 - 所有个位数字段建议统一用
String(x).padStart(2, '0')补零 - 避免手写
hour ，易漏、难维护
用 textContent 而不是 innerHTML 更新时间
时间只是纯文本，用 innerHTML 多余且有潜在风险：万一哪天变量里混入 <script> 字符串（比如调试时误写），就会被浏览器当作 HTML 解析执行。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记（深入）”；
- 改用
element.textContent = formattedTime更安全、更快 - 如果未来要加粗某部分时间（如秒数），再考虑用
innerHTML+ 小范围标签，而不是默认走这条路 - 所有现代浏览器都支持
textContent，无需兼容 IE8 及更早版本的话，放心用
setInterval 每秒更新的精度其实不准
主线程卡顿时，setInterval(updateTime, 1000) 可能连续两次执行间隔是 1050ms 或 1300ms，导致跳秒。对普通页面展示影响不大，但如果你正做倒计时或需要严格对齐秒级事件，就得换思路。
- 每次执行时用
new Date().getTime()算真实经过毫秒数，只在整秒边界更新 DOM - 或者改用
requestAnimationFrame配合时间差判断，更贴合浏览器渲染节奏 - 不过零基础起步，先用
setInterval跑通逻辑，再优化——别一上来就陷进精度陷阱
真正容易被忽略的是时区：new Date() 拿到的是用户本地时间，但如果页面要显示 UTC 或其他时区（比如“北京时间”固定为 UTC+8），就不能只靠 getHours()，得用 Intl.DateTimeFormat 或手动加减偏移量。这个点初学常被当成“时间不准”，其实是理解偏差。
