该用 而不是 当内容“曾经对、现在错”但未删除，仅需标记状态变更； 则必须配套 并带 datetime 和 cite 属性以体现编辑依据。
什么时候该用 <s></s> 而不是 <del></del>
当一段内容「曾经对、现在错」，但你没删它，只是标记它已失效——比如商品原价、停用的功能名、废止的条款编号，就该用 <s></s>。它不表示“编辑动作”，而是状态变更：<del></del> 则必须配套 <ins></ins> 使用，且要带 datetime 和 cite 属性才能体现删除依据。
常见错误现象：<s></s> 被塞进按钮里（<button><s>导出</s></button>），语义冲突：一个“已失效”的可点击元素？浏览器可能禁用焦点，读屏器直接跳过。
- API 文档中标注废弃字段：
<s>user_token</s>（后台已停发，但旧客户端还在用） - 法律条文修订稿中禁止用
<s></s>：必须用<del datetime="2026-03-01">第十二条</del><ins datetime="2026-03-01">第十二条之一</ins> - 用户评论里写“这个参数不对”，不能套
<s></s>——主观质疑不是语义失效
<s></s> 不支持 datetime 和 cite 属性
HTML5 明确禁止给 <s></s> 加 datetime 或 cite。W3C 校验器会报错，Hugo/Jekyll 等静态站点生成器在严格模式下直接构建失败。
想补时间信息？别硬加属性。可行方案是：
- 在
<s></s>后紧跟<time datetime="2026-03-21">（已于2026年3月21日下架）</time> - 用自定义属性辅助 JS 处理：
<s data-expired="2026-03-21">¥199</s>，但别指望读屏器识别它 - 真需要审计追踪？换
<del datetime="2026-03-21" cite="/docs/dep-notice.html"></del>
纯视觉删除线请绕开 <s></s>
待办事项打钩后划掉、UI 上灰显+横线、设计稿标注“此模块暂不实现”——这些都没发生语义变化，只是样式反馈，不该用 <s></s>。
正确做法是 CSS：text-decoration: line-through 配合 opacity: 0.6 控制视觉层级；响应式需求（小屏隐藏文字、大屏划掉）用 class 切换更可控。
- 别对
<button></button>、<a></a>套<s></s>：语义与交互冲突 - 促销页写
<s>¥199</s>¥99，读屏器可能读作“已废弃:¥199”，用户会困惑“还能买吗？”——若只是临时缺货，语义就错位了 - 关键过期提示（如 GDPR 数据过期）必须用明文 + 时间戳，不能只靠
<s></s>
屏幕阅读器对 <s></s> 几乎不播报语义
NVDA、VoiceOver 等主流读屏软件默认不处理 <s></s> 的“已失效”含义，多数只读出文字本身，顶多加个“已废弃”前缀，且不保证一致。
真正容易被忽略的是：加了 <s></s> 不等于信息传达到了。业务逻辑、上下文、辅助技术三者必须对齐。
- 稳妥做法：在
<s></s>内部或紧邻位置补充明文说明，例如<s>¥199</s>（活动已于2026年3月21日截止） - 对重要过期信息，额外包裹触发动态播报的元素（如
aria-live区域） - 若后台接口字段废弃但文档未说明原因，此时用
<s></s>比<del></del>更合适——因缺乏删除依据
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
