1

ARIA 属性是否需要存在于实际的 HTML 中？或者，它们可以在运行时通过 Javascript 添加吗？

考虑以下场景...

<button id="submit" type="submit">Submit</button>
<div id="validation-message"></div>

如果用户的浏览器没有 Javascript，我们会在新页面上向他们展示验证（由服务器处理和生成）。如果用户的浏览器确实有 Javascript，我们在上面的 HTML 中添加以下内容，然后在 DIV 中动态显示验证。

$('#submit').attr({'aria-haspopup':true, 'aria-owns':'validation-message'});
$('validation-message').attr({'role':'alert', 'aria-live':'assertive'});

我想另一个问题是，将这些 ARIA 属性直接包含在 HTML 源代码中是否会造成伤害？如果 Javascript 不存在，ARIA 会做任何事情吗？

4

2 回答 2

4

ARIA 地标角色可以直接放入标记中，即使禁用 JavaScript，它们也很有用。如果 ARIA 属性描述的功能仅在启用 JavaScript 时可用，我会说可以使用 JavaScript 添加这些属性。

于 2011-08-01T17:12:46.303 回答
0

W3C 文档（工作草案）在 HTML 中使用 WAI-ARIA建议，在子句Add ARIA inline or via script? ，ARIA 属性是通过脚本添加的，而不是用 HTML 标记编写的。然而，它补充说，如果该属性“不依赖脚本来提供交互行为”或“内容和交互仅在启用脚本的浏览上下文中受支持”，则该属性可以用标记编写。

这有点间接，甚至可能是人为的，说将属性放在标记中大部分是可以的。一个例外是属性表达的关系在没有脚本的情况下也有意义，但在禁用脚本时提供不正确的信息。我会说它aria-haspopup可能属于这一类，因为可以想象一个元素也可能有一个没有脚本的弹出窗口，但目前它必须用脚本来实现——所以当脚本被禁用时，浏览器可能仍然期望aria-haspopup具有相关性，因此得出错误的结论。

于 2013-05-28T17:34:29.913 回答