"more info" 图标的正确 ARIA 角色是什么？
What is the correct ARIA role for a "more info" icon?
工具提示的一个常见用途是将其添加到 ⓘ 图标以显示“更多信息”。我目前正在努力使我的组件更易于访问，因此我想将“工具提示”角色添加到我的工具提示组件中。但令人惊讶的是，WAI-ARIA 的 Mozilla 网页明确表示 here:
The tooltip is not the appropriate role for the more information "i" icon, ⓘ. A tooltip is directly associated with the owning element. The ⓘ isn't 'described by' detailed information; the tool or control is.
尽管 official docs 没有说明任何事情。
那么，如果我将工具提示组件完全用于该目的，它能起到什么作用？还是我误解了那句话？
这是我的工具提示组件模板，具有我希望添加的角色：
<div role="tooltip" id="tooltip" class="tooltip-container">
<div class="inner">{{ content }}</div>
<span class="caret"></span>
</div>
单击时打开“工具提示”实际上称为 toggletip。我认为你应该使用 aria-live attribute or even the status role.
这是一篇对此进行描述的文章：https://inclusive-components.design/tooltips-toggletips/
您发布的 MDN 片段是正确的，因为它不是应该获得工具提示角色的图标。图标只是一个按钮。
如果提示中的内容可以表示为 'flat text'（即没有标题或列表等结构），您可以使用 aria-describedby 将您的组件与其相关联，如 w3c 文档中所述。
如果提示内容 有结构，请改用 aria-details。这是可以接受的。
其中任何一个都会将提示内容与组件相关联，从而符合“信息和关系”。
工具提示的一个常见用途是将其添加到 ⓘ 图标以显示“更多信息”。我目前正在努力使我的组件更易于访问，因此我想将“工具提示”角色添加到我的工具提示组件中。但令人惊讶的是，WAI-ARIA 的 Mozilla 网页明确表示 here:
The tooltip is not the appropriate role for the more information "i" icon, ⓘ. A tooltip is directly associated with the owning element. The ⓘ isn't 'described by' detailed information; the tool or control is.
尽管 official docs 没有说明任何事情。
那么，如果我将工具提示组件完全用于该目的，它能起到什么作用？还是我误解了那句话？
这是我的工具提示组件模板，具有我希望添加的角色：
<div role="tooltip" id="tooltip" class="tooltip-container">
<div class="inner">{{ content }}</div>
<span class="caret"></span>
</div>
单击时打开“工具提示”实际上称为 toggletip。我认为你应该使用 aria-live attribute or even the status role.
这是一篇对此进行描述的文章：https://inclusive-components.design/tooltips-toggletips/
您发布的 MDN 片段是正确的，因为它不是应该获得工具提示角色的图标。图标只是一个按钮。
如果提示中的内容可以表示为 'flat text'（即没有标题或列表等结构），您可以使用 aria-describedby 将您的组件与其相关联，如 w3c 文档中所述。
如果提示内容 有结构，请改用 aria-details。这是可以接受的。
其中任何一个都会将提示内容与组件相关联，从而符合“信息和关系”。