del标签必须闭合且仅包裹内联元素，不可包裹p、ul等块级元素；datetime属性须严格遵循iso 8601格式（如2026-06-23t13:50:00+08:00）；应与ins成对使用以表达完整修订语义。
del标签必须闭合，且不能包裹块级元素
常见错误是把 <del></del> 当成视觉装饰标签，直接套在 <p></p> 或 <ul></ul> 外面，比如：<del><p>整段被删</p></del>。这违反 HTML 规范——<del></del> 是内联语义容器，浏览器会强制将其子内容扁平化，导致 DOM 结构错乱、document.querySelectorAll('del') 漏匹配、React/Vue 中 key 失效。
正确做法是只包裹内联内容，如文字、<span></span>、<em></em> 等；若真需标记整段删除，应为每个内联单元单独加 <del></del>，或用 CSS 设置 display: inline-block 显式声明布局行为（但语义上仍代表“这段文字被删”，而非“这个段落被删”）。
datetime 属性必须严格符合 ISO 8601 格式
datetime 不是可有可无的装饰字段，它是唯一被所有现代浏览器识别并可用于 JS 提取的修订时间依据。但格式稍有偏差就会失效：比如写成 2026-06-23 13:50（缺 T 和时区）、2026/06/23（斜杠非法）、或 2026-6-23T13:50:00+08:00（月/日未补零）——这些都会让 del.dateTime 返回空字符串或 null。
- ✅ 正确示例：
<del datetime="2026-06-23T13:50:00+08:00">¥199</del> - ❌ 错误示例：
<del datetime="2026-6-23">¥199</del> - JS 安全读取方式：
const dtStr = del.getAttribute('datetime'); const parsed = dtStr ? new Date(dtStr) : null;（注意：del.dateTime是只读属性，但不自动解析，仍需手动转 Date）
别用 或 text-decoration: line-through 替代 del
三者视觉效果可能相似，但语义和机器可读性天差地别：
-
<s></s>表示“内容不再准确或不推荐”，比如商品原价，但它不表达“编辑行为”，屏幕阅读器读作“带删除线的文字”，不会播报“已删除” -
text-decoration: line-through是纯样式，无任何语义，搜索引擎和辅助技术完全忽略 -
<del></del>则明确向浏览器、爬虫、屏幕阅读器传达“该文本已被逻辑性移除”，并支持cite和datetime属性，用于审计、比对、无障碍播报
协作系统或文档修订工具（如 Git HTML diff 渲染器）只认 <del></del> + <ins></ins> 对，其他写法等于没标。
del 必须与 ins 配合才能构成完整修订语义
单独使用 <del></del> 只说明“这里删了”，但没说“替换成什么”。搜索引擎和辅助技术依赖成对出现来理解变更意图。例如价格更新：<p>原价:<del datetime="2026-06-20">¥199</del> <ins datetime="2026-06-20">¥149</ins></p>。
容易被忽略的是：两个标签的 datetime 值应一致（表示同一轮修改），且 cite 若存在，最好指向同一修订依据（如政策变更公告 URL）。否则，语义断裂——机器无法建立“删旧→上新”的因果链，无障碍用户听到两段孤立播报，SEO 也无法关联新旧内容权重。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
