免费在 GitHub 公开中文介绍

duplicate-id-aria

检查页面渲染后的HTML中，ARIA属性引用的ID是否重复，找出可能导致标签或说明被错误朗读的位置，并指导修改ID、更新引用及验证结果。

原文查看原文说明

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Use unique IDs for ARIA references. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

thedaviddias/Front-End-Checklist

AI 评分100分/ 100 查看安装方法

适用场景

排查屏幕阅读器读错标签的原因
检查重复组件中的ID冲突
核查设计系统中的ARIA引用

中文介绍

功能

检查ARIA属性引用的ID是否重复，帮助修改ID及其引用，让标签和说明关联到预期元素。ARIA是一类向辅助技术传达界面角色和状态的属性。该技能会检查aria-labelledby等属性的引用目标；如果多个元素使用同一ID，就会同时检查目标元素的ID和引用它的属性，并解释重复ID为何可能导致其他标签或说明被朗读。

适用场景

适合排查屏幕阅读器朗读了意外说明的问题，也适合审查重复使用相同组件的页面。它会检查渲染后的HTML及交互过程中的状态，具体指出涉及的元素。必要时，还会检查原生HTML语义、键盘操作和焦点移动。

使用示例

“检查这个页面中，ARIA属性引用的ID是否有重复。”
“修改重复的ID及其引用，并说明如何使用浏览器的无障碍检查工具或辅助技术验证修改结果。”

注意事项

没有特别注意事项。

本介绍由 AI（OpenAI Codex）根据公开的 SKILL.md 撰写。准确的规格请查看下方原文。

客观评估

AI 仅根据 SKILL.md 的内容，从 4 个方面进行了评估。星标数和热度不计入评估。

指令清晰度能否看出何时使用、做什么: A良好资料明确说明检测ARIA引用的重复ID，并修改ID及其引用。
步骤具体性步骤、输入输出和示例是否具体: A良好检查、修复和解释部分列出步骤，并要求指出具体元素及验证方法。
安全性发送数据、删除文件、执行命令等是否有说明: A良好操作针对HTML的ID及引用，未涉及外部发送、删除或读取凭据。
安装难易度所需工具和 API 密钥是否少且有说明: A良好使用HTML、浏览器检查工具或辅助技术，无需API密钥或付费服务。

总分按每项 A=25 分、B=15 分、C=5 分相加。由 AI（OpenAI Codex）于 2026年10月23日评估。仅供参考，安装前请同时查看原文。

如果您认为评估有误，请申请复核

包含的文件（2）

SKILL.md1.8 KB
references/rule.md3.0 KB

SKILL.md（原文）

安装前可以查看交给 AI 代理的指令内容。

Use unique IDs for ARIA references

When ARIA attributes point to duplicate IDs, assistive technologies may read the wrong label or description, providing misleading information to the user.

Quick Reference

Ensure IDs referenced by ARIA attributes (e.g., aria-labelledby) are unique
Avoid duplicate IDs that lead to ambiguous accessibility relationships
Verify that ARIA controls correctly target their intended elements

Check

Identify elements where an ARIA attribute references an id that appears multiple times in the DOM.

Fix

Ensure all elements referenced by ARIA attributes have unique IDs and update the references accordingly.

Explain

Explain how unique IDs are essential for establishing reliable relationships between ARIA attributes and their targets.

Code Review

Review the rendered markup and interactive states that affect Use unique IDs for ARIA references. Flag exact elements, roles, labels, focus behavior, or keyboard interactions that violate the rule, and note how to verify the fix with browser accessibility tooling or assistive tech.

For full implementation details, code examples, and framework-specific guidance, see references/rule.md.

Rule page: https://frontendchecklist.io/rules/accessibility/duplicate-id-aria

评价

还没有评价。欢迎分享你的使用感受。

无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

同一仓库的技能