NVDA屏幕阅读器无法读取带role=status和aria-label的div问题排查

核心原因 #

• role="status"的特性限制：role="status"属于ARIA实时区域（live region），默认是aria-live="polite"级别，它的设计逻辑是仅在内容动态更新时触发播报。如果元素初始为空且没有后续内容变化，NVDA在Chrome环境下不会读取它的aria-label——这不是NVDA的bug，是符合实时区域的规范行为。
• role="button"的交互属性：role="button"是交互式控件，会被屏幕阅读器的焦点导航系统纳入识别范围，只要设置了aria-label，哪怕元素为空，NVDA也会在焦点移至该元素时读取标签内容，这是交互式控件的标准处理逻辑。

正确用法建议 #

根据你的需求选择对应方案：

• 若需要动态播报内容更新：保留role="status"，但要确保元素有初始内容，或通过JavaScript动态更新内容来触发播报。示例：

  <!-- 带初始内容 -->
  <div role="status" aria-label="chicken">chicken</div>
  
  <!-- 动态更新触发播报 -->
  <div role="status" id="status"></div>
  <script>
    document.getElementById('status').textContent = 'chicken';
  </script>
  

• 若只是需要静态提示被读取：如果该元素不需要实时更新功能，无需使用role="status"，可以直接用普通元素配合aria-label（建议尽量添加可见内容，无内容场景需确保是必要设计），或者改用适合静态提示的角色。

内容的提问来源于stack exchange，提问作者Lunny