假设有一个静态的 HTML 表格，例如:
<table>
<thead>
<tr>
<th scope="col" aria-sort="none"><a href="...">Name <span title="Sort">▲</span></a></th>
<th scope="col" aria-sort="ascending"><a href="...">Score <span title="Ascending">▲</span></a></th>
</tr>
</thead>
<tbody>
<tr>
<td>C</td>
<td>1</td>
</tr>
<tr>
<td>A</td>
<td>5</td>
</tr>
<tr>
<td>B</td>
<td>9</td>
</tr>
</tbody>
</table>
会不会使用aria-sort合适(当 UA 支持它时)？
http://www.w3.org/TR/wai-aria/states_and_properties#aria-sort
我相信这可能会有用，但 W3C 验证器目前需要 role="columnheader"在 <th scope="col"> 上，这有点多余，因为它已经暗示了 th[scope="col"] :
http://www.w3.org/TR/wai-aria/roles#columnheader
一旦开始指定，您还需要为 <table role="grid"> 之前的所有内容设置一个角色...如果您不使用适当的标签，这很好。
最佳答案
验证器是正确的。这听起来可能很奇怪，但问题出在规范中，而不是验证器中。
正如@CraigFrancis 评论的那样，这个问题已经在验证者的邮件列表中提出，其中一条消息指的是错误报告。该错误已closed根据规范，验证者的行为是正确的。这意味着如果您使用 aria-sort ，您需要显式设置 role至 columnheader或 rowheader , 即使你有 scope属性。
如问题所述，这意味着额外的 role然后在文档树中需要更高的属性，这样您至少可以得到以下内容:
<!doctype html>
<title>aria-sort issue</title>
<table role="grid">
<thead>
<tr role="row">
<th scope="col" role="columnheader" aria-sort="none"><a href="...">Name <span title="Sort">▲</span></a></th>
<th scope="col" role="columnheader" aria-sort="ascending"><a href="...">Score <span title="Ascending">▲</span></a></th>
</tr>
</thead>
<tbody>
<tr>
<td>C</td>
<td>1</td>
</tr>
<tr>
<td>A</td>
<td>5</td>
</tr>
<tr>
<td>B</td>
<td>9</td>
</tr>
</tbody>
</table>
这看起来相当多余，特别是因为 role=columnheader 的定义说它是“相当于 HTML 的结构 th具有列作用域的元素”。但是，HTML5 LC definitions related to WAI-ARIA不要为 th 指定任何隐含的 ARIA 语义(或 tr 或 table )。这可能反射(reflect)了使用表格进行布局，这种情况已经很普遍，因此通常假设 table 是不现实的。元素表示结构(或“语义”)意义上的网格(数组、矩阵)。因此，当 table 的“表格化”时元素与 ARIA 相关，必须用 role 明确表示不同嵌套级别的属性。
请注意 aria-sort属性纯粹是信息性的，声明性的。它描述表格(网格)的项目是升序或降序(或其他)顺序。它不要求浏览器对它们进行排序或创建用于排序的 UI 工具。实际上，当作者在页面生成服务器端或使用 JavaScript 客户端对表格进行排序时，就会使用它。用户代理可以通过多种方式使用这些信息，例如通过向用户通知订单。
ARIA 规范补充说“对于每个表格或网格，作者应该应用 aria-sort一次只有一个标题”。该代码示例违反了此建议。 (然而，验证器没有发出错误消息；这是应该的，而不是应该的。)在这种情况下，aria-sort="none"应该被删除。 aria-sort属性，当设置在列标题上时，指定表格的行根据该列排序，因此出于显而易见的原因，它应该只设置在一列上。
关于html - 在经过验证的 HTML5 中使用 aria-sort，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24863531/