<time>标签必须带ISO 8601格式datetime属性,含显式时区,显示文本须与datetime逻辑一致,否则机器解析失效。

datetime属性必须写,且格式不能错
浏览器和爬虫只解析datetime的字符串值,不校验、不容错。填错等于没写。
-
datetime="2026-05-25"✅ 日期型(4位年、2位月日,用短横线) -
datetime="2026-05-25T23:36:00+08:00"✅ 含时区的完整时间(T不可省,±hh:mm必须显式) -
datetime="PT1H30M"✅ 持续时间(P开头,大写) -
datetime="2026/05/25"❌ 斜杠分隔,new Date()在Safari中可能返回Invalid Date -
datetime="2026-5-25"❌ 缺零填充,不符合ISO 8601 -
datetime="2026-05-25 (周一)"❌ 括号和中文破坏机器可读性
显示文本和datetime可以不同,但逻辑必须一致
<time>的核心设计就是分离「人看的」和「机器读的」。你控制显示内容,但datetime必须是确定、无歧义的绝对时间点。
-
<time datetime="2026-05-25">今天</time>✅ 页面生成时确实为当天,逻辑成立 -
<time datetime="2026-05-25">立夏</time>✅ 前提是上下文明确指该日(2026年立夏确为5月5日?需核对——但此处仅说明语义对齐原则) -
<time datetime="2026-05-25">下周二</time>❌ 2026-05-25是周一,不是“下周二”,自相矛盾 -
<time datetime="2026-05-25">昨天</time>❌ 静态HTML中,“昨天”会随日期推移持续错位
时区必须显式声明,否则跨环境解析结果不可控
不带时区的datetime="2026-05-25T10:00:00"会被不同工具按不同规则解释:浏览器按本地时区,Google可能按UTC,CDN缓存节点可能按服务器时区。
-
datetime="2026-05-25T10:00:00+08:00"✅ 明确北京时间 -
datetime="2026-05-25T02:00:00Z"✅ 明确UTC,适合后端统一存储 -
datetime="2026-05-25T10:00:00"❌ 表面看着正常,部署到海外CDN或被爬虫抓取时极易错位
别指望<time>自动做任何事
它不转换格式、不处理本地化、不更新倒计时、不支持嵌套块级元素,纯语义容器。
- 要把
2026-05-25显示成“2026年5月25日”?得用Intl.DateTimeFormat或CSS::before - 要显示“2小时前”?前端JS必须动态更新标签内文本,但
datetime值绝不能改 -
<time><p>2026-05-25</p></time>❌ 违反HTML规范,部分解析器会降级为两个独立节点
最容易被忽略的一点:时区缺失带来的错位,往往在本地开发时完全看不出问题,等上线被海外爬虫抓取或用户从东京访问时才暴露。



















