Javascript 如何让屏幕阅读器读取列表？

我想使用屏幕阅读器进行辅助阅读为了阅读列表中的文本，我在网上找到了一些例子，当

的项目用

包装时，它就可以工作了

我尝试了以下方法，但无效：

<ul role="list">
  <li role="listitem">
    <div><h3 aria-label="item 1">item 1</h3></div>
  </li>
  <li role="listitem">
    <div><h3 aria-label="item 2">item 2</h3></div>
  </li>
  <li role="listitem">
    <div><h3 aria-label="item 2">item 3</h3></div>
  </li>
  <li role="listitem">
    <div><h3 aria-label="item 4">itwem 4</h3></div>
  </li>
</ul>



项目1


项目2


项目3


itwem 4



希望你能帮助我。
如果你不需要的话，（aria-*
属性和
角色属性）就是而不是使用它。您的代码示例虽然有效，但有太多的aria，这些都是多余的

默认情况下，
有一个role=列表，并且指定不设置角色

元素也是如此

根据“”的步骤2F，标题的可访问名称（
）将来自标题的文本内容，因此无需为
设置
aria标签

因此，您的代码示例与此代码段完全相同：

<ul>
  <li>
    <div>
      <h3>item 1</h3>
    </div>
  </li>
  <li>
    <div>
      <h3>item 2</h3>
    </div>
  </li>
  <li>
    <div>
      <h3>item 3</h3>
    </div>
  </li>
  <li>
    <div>
      <h3>item 4</h3>
    </div>
  </li>
</ul>



项目1


项目2


项目3


项目4



通常，列表不可通过键盘聚焦，因此您不会使用TAB键导航到它们。我想这就是为什么您提到将列表项包装在锚定标记中，
，以允许您使用TAB键指向链接

屏幕阅读器用户导航到列表的方式是使用快捷键。JAWS和NVDA都使用L键导航到列表，使用I（“眼睛”）键导航到列表项。屏幕阅读器用户还可以使用上/下箭头键遍历DOM。iOS设备上的VoiceOver用户可以将其rotor设置为“列表”，然后可以向上/向下滑动到下一个列表

因此，如果您试图使用键盘强制列表可聚焦，您将对屏幕阅读器用户造成伤害，因为他们不习惯以这种方式导航到列表。非交互元素（如
或
或
）不应该是键盘聚焦的。
我觉得您的标记很好-到底发生了什么？您正在使用什么屏幕阅读器软件？运行时会发生什么？我使用MacOS voice over，它选择列表的第一项，但不读取列表或任何项目。感谢您的回答，我删除了额外的aria-*和角色，但无法使屏幕阅读器读取列表项目。告诉我您在屏幕阅读器中使用了哪些键来访问列表（以及您正在测试的屏幕阅读器）