Question

动态应用ARIA状态时，最佳选择是什么？我只是问，因为单独从规范中解读正确的用法并不容易。

您是否应该将false作为状态申请？我的意思是，明确说明false或不存在属性之间是否有区别，如果有，是什么？
这些属性是应该存在于DOM的初始加载中还是仅在与之交互时切换？我主要是指aria-states，而不是aria-properties或aria-roles因为他们不太可能改变。

示例1

<div role="tablist">
  <a href="#" role="tab" aria-controls="panel-1" aria-selected="true">Tab 1</a>
  <a href="#" role="tab" aria-controls="panel-2" aria-selected="false">Tab 2</a>
</div>

VS。（注意：aria-selected时<{1}}

false

示例2

<div role="tablist">
  <a href="#" role="tab" aria-controls="panel-1" aria-selected="true">Tab 1</a>
  <a href="#" role="tab" aria-controls="panel-2">Tab 2</a>
</div>

VS。（注意：该属性已被删除，<div> <div id="panel-1" role="tabpanel" aria-hidden="false"></div> <div id="panel-2" role="tabpanel" aria-hidden="true" style="display:none"></div> </div>时<{1}}

aria-hidden

应该false使用，因为它会在某些时候可见？

我以<div> <div id="panel-1" role="tabpanel"></div> <div id="panel-2" role="tabpanel" aria-hidden="true" style="display:none"></div> </div>为例，您可能希望使用aria-hidden和/或style=display:none类。 < / p>

Answer 1

取决于value type：

aria-selected的值类型为“true / false / undefined”，其中默认值始终为 undefined ，这意味着在这种情况下：

该元素不可选。

这与值 false 不同，这意味着在这种情况下：

未选择可选元素。

→因此，如果aria-selected的值为 false ，则应指定aria-hidden。
aria-hidden的值类型为“true / false”，其中默认值始终为 false 。

→因此，如果其值 false ，则不必指定{{1}}。

正确使用WAI-ARIA状态？

1 个答案: