我正在使用 http://validator.w3.org/nu/对我的文档执行 HTML5 验证。我不明白为什么我在以下代码中收到验证错误。我检查了 http://www.w3.org/TR/wai-aria/roles#treeitem并认为可以将一个 role="treeitem"的 li 元素放在一个 role="group"的 ul 元素中。 nu 验证器告诉我这是不允许的。我想知道 nu validator 在他的判决中是否正确，如果是这样，我们在哪里可以找到有关规定这一点的 ARIA 树架构的信息。谢谢。
未验证的示例代码:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Trees</title>
</head>
<body>
<h1 id="label_1">Fruits and vegetables</h1>
<ul id="tree" role="tree" tabindex="0" aria-labelledby="label_1">
<li role="treeitem" aria-expanded="true">
<a href="#">Fruits</a>
<ul id="tree1_1" role="group">
<li role="treeitem"><a href="#">Oranges</a></li>
<li role="treeitem"><a href="#">Apples</a></li>
</ul>
</li>
<li role="treeitem">
<a href="#">Vegetables</a>
<ul id="tree1_2" role="group">
<li role="treeitem"><a href="#">Carrots</a></li>
</ul>
</li>
</ul>
</body>
</html>
最佳答案
role="group" 绝对允许在 ul 元素上使用。 The HTML5规范目前也反射(reflect)了这一点。 Validator.w3.org/nu/和 http://validator.w3.org/两者都将其视为有效。 Validator.nu 似乎仍然将其标记为无效。
无论验证如何，使用嵌套树在这里都不是正确的选择。它可能会通过验证器，但这很可能只是因为它允许嵌套小部件(就像您可以在树项中嵌套 slider 或文本字段一样)。但它们仍被视为单独的小部件，而不是树所应有的单一复合小部件。内部树不会成为外部树结构的一部分，它只是一个单独的小部件，恰好嵌套在其树项之一中。
关于ARIA 树上的 HTML5 验证，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14616615/