javascript - DOM 加载后添加的 WAI-ARIA 属性

Question

我必须改进网站的网络可访问性。 我在 Drupal 中尽可能直接在 html 中添加 aria 属性，但有些东西我无法在 html 中添加，例如轮播和幻灯片，因此在加载文档后向元素添加 aria 属性是否可以。 就像

$(document).ready(function(){
  $(".item").attr("aria-label", "My Label");
});

Answer 1

是的，如果您没有其他选择，那么这样做是可以接受的。

但是请注意，对于某些屏幕阅读器来说，这并不是 100% 万无一失的方法(它应该可以在最新版本的 NVDA、VoiceOver 和 JAW 中正常工作)。

一些较旧的屏幕阅读器会在文档加载时构建辅助功能树，因此通过普通 JS 作为页脚中的内联 JS block 来完成此操作是谨慎的(虽然有些不好的做法，但这是我能想到的最佳解决方法) .

考虑到您当前的设置，这可能是不可能的，如果是这种情况，那么您建议的方式是可以接受的，并且是您在合理的时间范围内能够实现的最佳方式。

如果你真的想修复它(你应该!) - 你是否考虑过替换有问题的插件/库(或扩展/编辑库/插件)以在生成 HTML 时添加所需的元素。这就是我处理这个问题的方式。