<data>: 数据标签
最后更新：2026-10-13
<data>数据标签
将一段可见文本与一个机器可读的值关联，例如给商品名附带价格或编号。浏览器只显示可见文本，但脚本可读取 value 属性。
| 分类 | 文本内容 |
|---|---|
| 内容模型 | 流式内容 |
| 允许的父元素 | 接受流式内容的元素 |
| 闭合标签 | 需要 </data> 标签 |
| 状态 | 标准 |
📝 语法
<data value="598">￥598</data>⚙️ 属性
该元素支持全局属性及以下专有属性：
| 属性 | 值 | 描述 |
|---|---|---|
value | 机器可读的取值，文本本身仍照常显示。 |
▶ 示例
编辑下方代码，在 playground 中查看实时效果：
🌐 浏览器支持
| 浏览器 |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <data> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| 所有主流浏览器均支持 | |||||
提示： 只需显示时间相关的机器值（如日期）时，用 <time> 比 <data> 更语义化。
❓ 常见问题
Qdata 标签是做什么用的？
A
<data> 把「人读的内容」与「机器读的值」绑定：内容写在标签内，机器值放 value 属性。例如 <data value='20261009'>10 月 9 日</data>，脚本和爬虫拿到的是规范化的值。Qdata 和 time 有什么区别？
A分工明确：日期时间用
<time>（datetime 格式受 ISO 8601 约束）；其他任意数据（编号、数量、坐标、ID）用 <data>，value 格式自由。两者都实现了「显示与数据分离」。Qdata 标签的 value 属性是必需的吗？
A是。
<data> 若没有 value 属性就没有存在意义（规范要求 value 必填），纯文本场景直接写文字即可。需要机器可读但没有合适 value 时，考虑用隐藏字段或 data-* 自定义属性。🏷️ 相关标签
💡 相关案例
更多案例即将上线，敬请期待。
📚 相关教程
