我找到了两种可能的解决方案：

1. 应用 role="menuitem" 为<li>标签：

   <li role="menuitem"><a ...>some menuitem</a></li>

2. 应用 role="menuitem" 为<a> tags:

   <li role="presentation"><a role="menuitem" ...>some menuitem</a></li>

我认为第二种解决方案是合乎逻辑的，但我不确定。我不能在更复杂的情况下使用它，只有 2，因为子菜单项不是<a> tag:

<li role="menuitem"><a ...>some menuitem</a></li>
<li role="menuitem" aria-haspopup="true">
  <a ...>some menuitem with children </a>
  <div><ul>
    <li role="menuitem"><a ...>submenuitem</a></li>
    ...
  </ul></div>
</li>

这是对的吗？是否有一些额外的可能的改进？

HTML 结构是由我使用的框架定义的，我无法更改它。

回答所提出的问题

如果您真正将操作系统样式的菜单应用于应用程序，那么您需要将role on the <a>。这是执行菜单项功能的项目（链接到另一个视图、页面或状态）。

所以你的第二个建议是正确的：

<li role="presentation"><a role="menuitem" ...>some menuitem</a></li>

曲线球

话虽这么说，我怀疑您并不真正想要操作系统风格的菜单。要了解对一个人的期望，请查看WAI-ARIA 创作实践 item 2.14 菜单或菜单栏 https://www.w3.org/TR/wai-aria-practices-1.1/#menu.

通过调用这种菜单，您就是在告诉屏幕阅读器的熟练用户，它将像操作系统菜单一样运行，这意味着您需要遵守下面的键盘命令（因此您必须对它们进行全部编码，ARIA 不只需让浏览器尊重它们）。

相反，考虑只使用<nav>元素来保存您的列表（将向屏幕阅读器宣布并充当页内导航的地标），保持列表语义到位（IOW，不要使用role=presentation（因为您希望屏幕阅读器的用户知道有多少个项目），并将其设置为您认为合适的视觉显示形式。

这样你就不会创建一个worse屏幕阅读器用户在努力帮助他们（或满足清单项目）方面的经验。

ARIA 菜单键盘交互

• 当一个menu打开，或者当menubar接收焦点，键盘焦点放置在第一个项目上。所有项目均可聚焦，如 4.6 组件内的键盘导航中所述。
• Enter:
  • 当焦点位于menuitem有一个子菜单，打开子菜单并将焦点放在第一个项目上。
  • 否则，激活该项目并关闭菜单。
• Space:
  • 当焦点位于menuitemcheckbox，更改状态而不关闭菜单。
  • 当焦点位于menuitemradio未勾选的，无需关闭菜单，勾选焦点menuitemradio并取消选中任何其他选中的menuitemradio同组中的元素。
  • （可选）：当焦点位于menuitem有一个子菜单，打开子菜单并将焦点放在第一个项目上。
  • （可选）：当焦点位于menuitem没有子菜单，激活menuitem并关闭菜单。
• Down Arrow:
  • 当焦点位于menuitem in a menubar，打开其子菜单并将焦点置于子菜单中的第一项。
  • 当焦点位于menu，将焦点移动到下一个项目，可以选择从最后一个项目换行到第一个项目。
• Up Arrow:
  • 当焦点位于menu，将焦点移至上一项，可以选择从第一项换行到最后一项。
  • 当焦点位于menubar， 什么也没做。
• Right Arrow:
  • 当焦点位于menubar，将焦点移动到下一个项目，可以选择从最后一个项目换行到第一个项目。
  • 当焦点位于menu并在一个menuitem有一个子菜单，打开子菜单并将焦点放在第一个项目上。
  • When focus is in a menu and on an item that does not have a submenu, performs the following 3 actions:
    1. 关闭子菜单和所有父菜单。
    2. 将焦点移至下一个menuitem in the menubar.
    3. 要么：（推荐）打开该子菜单menuitem无需将焦点移至子菜单，或打开该子菜单menuitem并将焦点置于子菜单中的第一项。
    Note that if the menubar were not present, e.g., the menus were opened from a menubutton, Right Arrow would not do anything when focus is on an item that does not have a submenu.
• Left Arrow:
  • 当焦点位于menubar，将焦点移至上一项，可以选择从最后一项换行到第一项。
  • 当焦点位于某个项目的子菜单时menu，关闭子菜单并将焦点返回到父菜单menuitem.
  • When focus is in a submenu of an item in a menubar, performs the following 3 actions:
    1. 关闭子菜单。
    2. 将焦点移至上一个menuitem in the menubar.
    3. 要么：（推荐）打开该子菜单menuitem无需将焦点移至子菜单，或打开该子菜单menuitem并将焦点置于子菜单中的第一项。
• Home: If arrow key wrapping is not supported, moves focus to the first item in the current menu or menubar.
• End: If arrow key wrapping is not supported, moves focus to the last item in the current menu or menubar.
• 与可打印字符对应的任何键（可选）：将焦点移至当前菜单中标签以该可打印字符开头的下一个菜单项。
• Escape: Close the menu that contains focus and return focus to the element or context, e.g., menu button or parent menuitem, from which the menu was opened.
• Tab: Moves focus to the next element in the tab sequence, and if the item that had focus is not in a menubar, closes its menu and all open parent menu containers.
• Shift + Tab: Moves focus to the previous element in the tab sequence, and if the item that had focus is not in a menubar, closes its menu and all open parent menu containers.