EGN*_*EGN 11 accessibility wai-aria
使用时对元素的真正影响是什么
aria-owns="id"
和(!)
aria-controls="id"
当使用这两个属性时,浏览器如何通知屏幕阅读器？
Ada*_*dam 18
二者aria-controls并aria-owns当不能从DOM层次本身确定的两个元件之间的关系被使用.
aria-controls用于表示元素控制另一个元素.例如,视频的控制按钮,可视编辑器的工具栏或可折叠元素的按钮.屏幕阅读器如下颚将宣布将视觉焦点移动到元素的快捷方式.这要求元素处于可视流程中(否display:none).
aria-owns 表示当层次结构无法确定关系时,元素依赖于当前元素.
总而言之,举个例子,如果你有一个包含三个部分的旋转木马:
结果:
aria-controls将应用于" previous "或" next "之类的按钮以指向包装器.
aria-owns 将应用于标题列表的每个元素以指向包装器内的每个元素.
标题列表中的活动元素将具有该aria-selected属性
预期的效果是您可以将屏幕阅读器的视觉焦点移动到确定的元素.
Ste*_*ner 11
-owns和-controls之间的区别在于-owns创建一个不存在的父/子关系,-controls表示一个事物控制另一个.因此A可以控制B,但A不必是B的父级,因为情况就是如此.