time标签必须添加datetime属性，否则退化为普通span；datetime值须为iso 8601格式（如2026-04-30、14:59、2026-04-30t14:59+08:00或pt90m），确保机器可无歧义解析、排序、转换时区。

time 标签不是为了“看起来像时间”，而是为了让机器能**无歧义地读取时间**。不加 datetime 属性，它就退化成普通 span——搜索引擎、屏幕阅读器、JS 脚本全当没看见。

为什么必须写 datetime 属性

没有 datetime 的 <time>昨天</time>，对任何自动化工具都等于没写。原因很直接：

• “昨天”“下周二”“三分钟前”不是 ISO 8601，无法解析、排序、转换时区
• 搜索引擎靠 datetime 判断内容新鲜度，缺失则无法在搜索结果中展示“发布于 X 小时前”
• 屏幕阅读器只朗读 datetime 值（如 "2026-04-30T04:32+08:00"），而不是“刚刚”这类模糊文本
• JS 通过 el.dateTime 直接拿到标准字符串，避免用正则或 Date.parse() 硬解中文文本的风险

datetime 值怎么写才合法

必须是 ISO 8601 格式，且严格校验。常见有效写法包括：

• 日期："2026-04-30"（不能写 "2026/04/30" 或 "2026-04-30 " 多空格）
• 时间："14:59" 或 "14:59:30"（不能写 "下午2:59"）
• 完整时间戳："2026-04-30T14:59:30+08:00"（T 和时区偏移缺一不可）
• 持续时间："PT90M" 表示 90 分钟（不能写 "90分钟"）
• 年份或年月："2026"、"2026-04" 都合法

错误示例：datetime="2026-04-30 14:59"（缺 T）、datetime="next Tuesday"（非固定值，被忽略）、datetime="2026-04-30Z"（未声明本地时区，+08:00 更稳妥）。

anything-to-html

将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。

下载

哪些场景真该用 time，哪些纯属画蛇添足

用对地方才能发挥价值，滥用反而增加维护成本：

• ✅ 文章发布时间：<time datetime="2026-04-30T04:32+08:00">刚刚</time>
• ✅ 活动开始时间：<time datetime="2026-05-10T19:00+08:00">5月10日晚7点</time>
• ✅ 持续时间标注：<time datetime="PT120M">两小时</time>（方便聚合筛选）
• ❌ 页脚版权年份：© <time datetime="2026">2026</time> —— 语义错位，用 <small>2026</small> 更合适
• ❌ JS 动态倒计时初始值：直接 data-timestamp="1746016320" 更轻量，time 适合静态语义，不适合每秒更新

文本内容和 datetime 可以完全不一致

这是最容易被误解的一点：二者职责分离，不是“格式转换”，而是“人机分责”。

• 你可以写：<time datetime="2026-04-30T04:32+08:00">就在刚才</time>
• 也可以写：<time datetime="2026-05-01">明天</time>（只要当前是 4 月 30 日）
• 中文页面里，“三分钟前”“下周二”“农历四月初三”都是合理文本，但 datetime 必须是确定的 ISO 时间点
• 避免在文本里塞冗余信息，比如 <time datetime="2026-04-30">2026年4月30日（星期四）</time> —— 星期几应由 JS 或 CSS 动态补全，否则多语言切换时会出错

真正难的不是写对格式，而是想清楚：这个时间点是否需要被程序理解、排序、转换或联动？如果答案是否定的，那 time 标签就不该出现。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！