标签单独使用不显示时间，因为它只是语义容器，不渲染样式也不自动格式化；必须添加符合iso 8601标准的datetime属性（如2026-05-27t14:49:00+08:00），才能被搜索引擎、屏幕阅读器等机器正确识别和解析。
为什么 <time></time> 标签单独用不显示时间？
因为 <time></time> 本身不渲染任何样式，也不自动格式化内容——它只是语义容器。写成 <time>2026-05-27</time>，浏览器就当普通文字渲染，搜索引擎和屏幕阅读器根本识别不出这是时间。必须提供 datetime 属性，且值要符合 ISO 8601 标准，否则语义失效。
如何让 <time></time> 同时满足人看友好、机读准确？
核心是分离「机器可读的原始时间」和「人类可读的展示文本」：
-
datetime属性必须稳定、精确、无歧义：用new Date().toISOString()（UTC）或带时区偏移的 ISO 字符串（如"2026-05-27T14:49:00+08:00"），绝不用toLocaleString() - 标签内文本（
textContent）可以自由定制：比如显示“今天 14:49”“5月27日”甚至“刚刚”，但不能影响datetime值 - 动态更新时只改
textContent，绝不覆盖datetime属性——否则倒计时、RSS 抓取、结构化数据都会崩
用 JavaScript 动态更新 <time></time> 的安全写法
常见错误是每次调用都把新格式字符串同时塞进 textContent 和 datetime，导致原始时间丢失。正确做法：
- 初始化时一次性设置好
datetime：el.setAttribute('datetime', new Date().toISOString().slice(0, 19)) - 后续只更新
textContent：el.textContent = formatAsHumanReadable(now) - 若需每秒刷新，用
setInterval，但记得在页面卸载前clearInterval，避免内存泄漏 - 示例函数：
function updateReadableTime(el) {<br> const now = new Date();<br> el.textContent = `${now.getDate()}日 ${now.getHours()}:${now.getMinutes().toString().padStart(2,'0')}`;<br>}
容易被忽略的关键点
很多人以为只要用了 <time></time> 就算“语义化完成”，其实真正起作用的是 datetime 的存在与合规性。一旦漏掉属性、格式错位（比如写成 "2026/05/27"）、或动态更新时误写死属性，所有依赖结构化时间的功能（Google 富媒体搜索、无障碍访问、日历插件同步）都会静默失败——页面看起来完全正常，问题却藏在机器看不见的地方。
