datetime 属性必须严格遵循 ISO 8601 格式:日期为 YYYY-MM-DD,时间须以 T 分隔并显式声明时区(如 +08:00 或 Z),禁止使用斜杠、空格或省略前导零;仅日期、仅时间(需带 T 前缀)、完整时间戳各有明确格式要求;格式错误将导致机器无法解析,建议用 toISOString() 或 Intl.DateTimeFormat 生成。

datetime 属性的合法格式必须是 ISO 8601
datetime 属性不是随便写个“2024-5-1”或“下午3点”就能被解析的。浏览器和辅助技术只认标准 ISO 8601 格式,核心要求是:年份 4 位、月份和日期必须两位补零、时间部分用 T 分隔、时区显式声明(或用 Z 表示 UTC)。
常见错误包括:
- 写成
<time datetime="2024-5-1">五月一日</time>(月份/日期缺前导零) - 写成
<time datetime="2024/05/01">…</time>(斜杠不合法) - 写成
<time datetime="2024-05-01 15:30">…</time>(空格代替T,且无时区)
正确写法示例:
<time datetime="2024-05-01">2024 年 5 月 1 日</time> <time datetime="2024-05-01T15:30:00+08:00">下午 3:30</time> <time datetime="2024-05-01T07:30:00Z">UTC 时间早上 7:30</time>
只有日期、只有时间、带时区——三种场景对应不同写法
HTML 规范允许 datetime 只含日期、只含时间、或完整日期时间,但每种都有硬性格式约束:
立即学习“前端免费学习笔记(深入)”;
- 仅日期:
YYYY-MM-DD(如"2024-12-25"),不能省略-或换顺序 - 仅时间:
HH:MM或HH:MM:SS,**必须加T前缀**(如"T14:30"或"T09:15:22"),否则无效 - 完整时间戳:
YYYY-MM-DDTHH:MM:SS±HH:MM或YYYY-MM-DDTHH:MM:SSZ;Z是字面量,不能写成"UTC"或"GMT"
注意:<time datetime="14:30">两点三十</time> 是错的,必须写成 <time datetime="T14:30">…</time>。
不写 datetime 会怎样?写了但格式错又怎样?
不写 datetime 属性完全合法,<time> 标签仍可语义化包裹人类可读的时间文本,只是丧失机器可解析能力——搜索引擎、日历导入工具、屏幕阅读器无法提取结构化时间值。
如果写了但格式非法:
- 浏览器不会报错,也不会提示
- DOM 中
element.dateTime会返回空字符串 - 辅助技术直接忽略该属性,当成纯文本处理
- 结构化数据测试工具(如 Google Rich Results Test)会标记为无效
所以,宁可不写,也不要写一个看着像、实际错的 datetime。
JavaScript 里生成合规 datetime 字符串最稳的方式
手拼字符串极易出错(比如忘记补零、混淆时区)。推荐用原生 Date 方法生成:
const d = new Date("2024-05-01T15:30:00+08:00");
// → 转成本地时区的 ISO 字符串(含时区偏移)
d.toISOString(); // "2024-05-01T07:30:00.000Z"
// 如果要保留原始时区(如 +08:00),得手动拼:
d.getFullYear() + '-' +
String(d.getMonth() + 1).padStart(2, '0') + '-' +
String(d.getDate()).padStart(2, '0') + 'T' +
String(d.getHours()).padStart(2, '0') + ':' +
String(d.getMinutes()).padStart(2, '0') + ':' +
String(d.getSeconds()).padStart(2, '0') + '+08:00'
更稳妥的做法是用 Intl.DateTimeFormat 或成熟库(如 date-fns 的 formatISO),避免自己处理时区换算逻辑。
真正容易被忽略的是:即使你 JS 生成对了,后端模板或 CMS 输出时可能二次转义或截断——务必在最终 HTML 源码里 Ctrl+U 查看 datetime 属性值是否原样存在、有无多余空格或引号。



















