<s> 对比 <del> 在 HTML
<s> vs <del> in HTML
所以我在 HTML 中写了一个待办事项列表。其中一些待办事项已经完成。
<h1>TODO</h1>
<ul>
<li>I'm still to be done</li>
<li>I'm done</li>
</ul>
现在我想知道标记和设计这些项目的最佳方式是什么。完成后，我可以用 <s>、which seems much more acceptable these days 标记每个项目，因为它是 'no longer relevant':
<li><s>I'm done</s></li>
我可以选择 <del>，因为从某种意义上说，用户已经编辑了列表并将此项设置为删除（有点）：
<li><del>I'm done</del></li>
我可以添加一个 class 来说明此项的含义：
<li class="todo done">I'm done</li>
或三者的某种组合。或者完全是其他东西。
我关心的是可访问性和语义 - 我希望标记能够传达 'done' 项的含义。
这样做的最佳方法是什么？
A class 没有语义，所以如果可访问性和语义对你很重要，那么你必须使用 del 或 s.
该用s还是del不好说。对于 s 规范有这个例子：
<p>Buy our Iced Tea and Lemonade!</p>
<p><s>Recommended retail price: .99 per bottle</s></p>
<p><strong>Now selling for just .99 a bottle!</strong></p>
所以你想显示 reader 旧信息，但也告诉信息不再相关。
您的 TODO 示例包含在 del 部分的规范中 4.6.2 The del element
<h1>To Do</h1>
<ul>
<li>Empty the dishwasher</li>
<li><del datetime="2009-10-11T01:25-07:00">Watch Walter Lewin's lectures</del></li>
<li><del datetime="2009-10-10T23:38-07:00">Download more tracks</del></li>
<li>Buy a printer</li>
</ul>
我认为主要区别在于您有更多的可能性将语义信息添加到 del 而不是 s。所以 del 更多的是关于某些东西被删除的信息是否真的很重要，例如更改跟踪（diff 工具），TODO 列表，规范的一部分被删除，...。 s 是某种非正式的附加信息。
在普通的 HTML 中，class 值没有任何意义。除了使用语义元素之外，您还可以使用 类（类 可用于 CSS、JavaScript、文档目的等），但您不应该使用 类 代替 语义元素。
通过 del and s，您找到了在此上下文中有意义的两个相关元素。使用哪一个？它很可能不会产生实际差异。
语义差异很微妙：
使用 del，表示内容已从文档中删除（从语义上讲，内容是否仍然存在并不重要可见，或者如果您使用 CSS 在视觉上隐藏它）。它表示对文档的实际编辑。
使用 s，表示内容不再相关。
我想你显示已完成项目的目的可以帮助选择要使用的元素：
如果待办事项列表在不显示已完成项目的情况下也能正常工作（因此显示它们的目的是跟踪更改或检测错误），请选择 del。理论上，用户代理可以提供在特定时间点查看列表（利用 datetime 属性），而默认视图只能显示实际的当前内容（即 [= 中没有任何内容） 11=]).
如果显示已完成的事情与待办事项列表的含义相关，请选择 s.
如果您的情况在删除项目（例如，因为它是意外添加的，或者没有意义等）和将项目标记为完成之间存在相关差异，则您可能希望对前者使用 del，对后者使用 s。如果没有相关差异（例如，如果您无论如何都不会继续显示前一种情况下的项目），您可以忽略它。
（旁注：如果使用 del，也可以使用 ins 添加新的待办事项。）
两个答案都很棒。 s 和 del 确实是语义标签，因此有利于可访问性。不幸的是，没有浏览器在可访问性树中显示这些标签，因此屏幕 readers 无法传达有关标签的任何信息。但是您可以使用 CSS 解决它。有一个 simple blog 讨论 <mark> 元素，它也是语义化的，但不会向屏幕 readers 传达信息，但该博客提供了一个解决方法。您可以使用 s 或 del 做类似的事情。也就是说，使用 s 或 del ，但也 使用 CSS 来增加屏幕 reader 用户的标签。
所以我在 HTML 中写了一个待办事项列表。其中一些待办事项已经完成。
<h1>TODO</h1>
<ul>
<li>I'm still to be done</li>
<li>I'm done</li>
</ul>
现在我想知道标记和设计这些项目的最佳方式是什么。完成后，我可以用 <s>、which seems much more acceptable these days 标记每个项目，因为它是 'no longer relevant':
<li><s>I'm done</s></li>
我可以选择 <del>，因为从某种意义上说，用户已经编辑了列表并将此项设置为删除（有点）：
<li><del>I'm done</del></li>
我可以添加一个 class 来说明此项的含义：
<li class="todo done">I'm done</li>
或三者的某种组合。或者完全是其他东西。
我关心的是可访问性和语义 - 我希望标记能够传达 'done' 项的含义。
这样做的最佳方法是什么？
A class 没有语义，所以如果可访问性和语义对你很重要，那么你必须使用 del 或 s.
该用s还是del不好说。对于 s 规范有这个例子：
<p>Buy our Iced Tea and Lemonade!</p> <p><s>Recommended retail price: .99 per bottle</s></p> <p><strong>Now selling for just .99 a bottle!</strong></p>
所以你想显示 reader 旧信息，但也告诉信息不再相关。
您的 TODO 示例包含在 del 部分的规范中 4.6.2 The del element
<h1>To Do</h1> <ul> <li>Empty the dishwasher</li> <li><del datetime="2009-10-11T01:25-07:00">Watch Walter Lewin's lectures</del></li> <li><del datetime="2009-10-10T23:38-07:00">Download more tracks</del></li> <li>Buy a printer</li> </ul>
我认为主要区别在于您有更多的可能性将语义信息添加到 del 而不是 s。所以 del 更多的是关于某些东西被删除的信息是否真的很重要，例如更改跟踪（diff 工具），TODO 列表，规范的一部分被删除，...。 s 是某种非正式的附加信息。
在普通的 HTML 中，class 值没有任何意义。除了使用语义元素之外，您还可以使用 类（类 可用于 CSS、JavaScript、文档目的等），但您不应该使用 类 代替 语义元素。
通过 del and s，您找到了在此上下文中有意义的两个相关元素。使用哪一个？它很可能不会产生实际差异。
语义差异很微妙：
使用
del，表示内容已从文档中删除（从语义上讲，内容是否仍然存在并不重要可见，或者如果您使用 CSS 在视觉上隐藏它）。它表示对文档的实际编辑。使用
s，表示内容不再相关。
我想你显示已完成项目的目的可以帮助选择要使用的元素：
如果待办事项列表在不显示已完成项目的情况下也能正常工作（因此显示它们的目的是跟踪更改或检测错误），请选择
del。理论上，用户代理可以提供在特定时间点查看列表（利用datetime属性），而默认视图只能显示实际的当前内容（即 [= 中没有任何内容） 11=]).如果显示已完成的事情与待办事项列表的含义相关，请选择
s.如果您的情况在删除项目（例如，因为它是意外添加的，或者没有意义等）和将项目标记为完成之间存在相关差异，则您可能希望对前者使用
del，对后者使用s。如果没有相关差异（例如，如果您无论如何都不会继续显示前一种情况下的项目），您可以忽略它。
（旁注：如果使用 del，也可以使用 ins 添加新的待办事项。）
两个答案都很棒。 s 和 del 确实是语义标签，因此有利于可访问性。不幸的是，没有浏览器在可访问性树中显示这些标签，因此屏幕 readers 无法传达有关标签的任何信息。但是您可以使用 CSS 解决它。有一个 simple blog 讨论 <mark> 元素，它也是语义化的，但不会向屏幕 readers 传达信息，但该博客提供了一个解决方法。您可以使用 s 或 del 做类似的事情。也就是说，使用 s 或 del ，但也 使用 CSS 来增加屏幕 reader 用户的标签。