<data>标签仅用于将纯文本与其标准格式值配对，需配合itemscope/itemprop才能被结构化数据工具识别；value必须加引号且为ISO格式字符串，JS须用getAttribute('value')读取并trim()，不支持嵌套或data-*属性。
<data> 标签不是用来“储存数据”的通用容器，它只做一件事：把一段纯文本和它背后的标准格式值配对。用错场景，机器读不到，JS 也难取值。
什么时候该用 <data>，而不是 data-* 属性
核心看语义是否“展示即数据”——用户看到的文本本身就有唯一、规范的机器可读对应值，且这个值不参与交互逻辑或计算。
- ✅ 适合：
<data value="PENDING">处理中</data>（状态描述 + 状态码）、<data value="SKU-2026-X7">旗舰版 X7</data>（商品名 + 编码） - ❌ 不适合：给按钮加
data-action="delete"、存价格供 JS 计算——该用data-price="299.99"挂在<button>上 - ⚠️ 注意：
<data>必须配合itemscope/itemprop才能被 Google Rich Results Test 等工具识别为结构化数据；单独用只是语义标注，无 SEO 效果
value 属性必须是带引号的纯字符串
HTML 解析器会把没引号的 value=2026-07-23 当作数学表达式计算，结果变成 "2012"（2026 − 7 − 23），完全失真。
- ✅ 正确：
<data value="2026-07-23">今天</data> - ❌ 错误：
<data value=2026-07-23>今天</data>（无引号）、<data value="2026/07/23">今天</data>（非 ISO 格式） - ⚠️ 空格和引号要手动清理：写成
value=" 2026-07-23 "会导致 JS 读到带空格的字符串，后续JSON.parse或Date构造失败
JS 读取 <data> 的 value 不能用 dataset
<data> 的 value 不映射到 element.dataset，这是和 data-* 的根本区别。硬用 el.dataset.value 一定返回 undefined。
立即学习“前端免费学习笔记（深入）”；
- ✅ 正确读法：
el.getAttribute('value')或el.value（后者部分浏览器支持，但非标准） - ✅ 建议封装：
function getDataValue(el) { return el?.getAttribute?.('value')?.trim() || ''; } - ⚠️ 别漏
trim()：HTML 中手误多打空格，JS 里不清洗，后续new Date(value)直接报Invalid Date
<data> 不支持嵌套，也不能混用 data-*
它只接受纯文本内容，连 <strong> 都不允许；而且所有 data-* 属性挂上去都无效，浏览器忽略，爬虫无视。
- ✅ 正确：
<data value="2026-07-23">今日发货</data> - ❌ 错误：
<data value="2026-07-23" data-track-id="home-page">今日发货</data>（data-track-id白写） - ❌ 错误：
<data value="2026-07-23">今日发货<em>（限时）</em></data>（含 HTML 标签，解析失败） - ⚠️ 替代方案：需要强调或样式控制，把
<data>放进<span>或<div>里，样式和行为由外层承载
真正起作用的从来不是单个 <data> 标签，而是它和 itemprop、itemtype 组成的三件套；脱离 schema.org 上下文，它只是个语义干净的文本配对标记，不是 JS 数据仓库。
