aria-label仅用于无可见文本的交互元素，滥用会破坏无障碍；应避免在img、带label的input、无role的div/span上使用，优先用aria-labelledby引用页面已有文本，小程序中需配合aria-role使用。
aria-label 不是“加了就无障碍”，而是必须用在无可见文本的交互元素上，且不能和已有文本共存——加错位置或滥用，反而会让屏幕阅读器跳过功能、读错内容、甚至破坏表单语义。
哪些元素该加 aria-label
只给本身没有可读文本、但需要被屏幕阅读器识别功能的交互元素加。它不是装饰性补丁，是语义补救手段。
-
<button><i class="icon-close"></i></button>：纯图标按钮，没文字，必须加aria-label="关闭" -
<a href="#"><svg>...</svg></a>：仅含 SVG 的链接，需加aria-label="返回首页" -
<input type="checkbox">旁边没<label>包裹，又不能改 DOM 结构时，可用aria-label="订阅邮件通知"（但优先补<label>） - 小程序中
<view role="button">这类非原生按钮，必须配aria-label，否则 VoiceOver 或 TalkBack 只读“按钮”，不读用途
哪些情况加了反而坏事
aria-label 会覆盖元素内所有文本，且不校验值是否合理。很多问题不是没加，而是加错了地方、加了不该加的元素。
- 给
<img>加aria-label：错误！应始终用alt。二者语义冲突，可能触发重复朗读或完全忽略图像 - 给
<input type="text">单独加aria-label：危险！绕过了<label for="xxx">的语义绑定，导致焦点管理失效、语音控制无法关联、表单验证丢失上下文 - 给
<div>或<span>加aria-label：无效！这些元素默认不可聚焦、无交互角色，屏幕阅读器通常直接跳过；若真要让它可读，得同时加role="button"和tabindex="0"，但这暴露的是设计缺陷，不是补救方案 -
aria-label=""（空字符串）：等于告诉屏幕阅读器“这个元素无需朗读”，如果它实际可点击/可操作，就等于把交互入口对视障用户彻底隐藏了
aria-label 和 aria-labelledby 怎么选
核心区别就一条：前者是硬编码字符串，后者是引用页面里真实存在的文本节点。选错会影响多语言、可维护性和动态场景支持。
立即学习“前端免费学习笔记（深入）”；
- 用
aria-label：内容固定、简短、无复用需求，比如aria-label="删除"、aria-label="展开详情" - 用
aria-labelledby：标签已存在于页面中，比如<h2 id="modal-title">编辑用户</h2>+<button aria-labelledby="modal-title"></button>，这样既避免重复写文案，又支持 i18n 和 DOM 更新同步 - 两者同时存在：
aria-labelledby优先级更高，aria-label被静默忽略——别混着写，调试时很难发现 - ID 引用必须真实存在：如果
aria-labelledby="xxx"中的xxxID 不存在，屏幕阅读器不会报错，也不会读任何内容，只能靠可访问性检查器里的「Name Computation」面板验证
小程序和移动端的特殊注意点
小程序（如微信）和 Android/iOS 原生 WebView 对 ARIA 支持不一致，aria-label 行为受 role 驱动，且系统间朗读差异明显。
- 小程序中
<view>必须配aria-role才能被识别为控件，单独加aria-label无效。例如：<view aria-role="button" aria-label="分享到朋友圈">↗</view> -
aria-role="img"在 iOS VoiceOver 下读“图像”，在 Android TalkBack 下可能读“图片”或直接跳过，依赖基础库版本（2.7.1+ 才稳定支持） - 移动端不支持所有 ARIA role，比如
aria-role="navigation"在部分安卓机型上会被忽略，建议用原生<navigator>或<scroll-view>替代 - 小程序开发工具内置「无障碍访问模式插件」，比肉眼检查更可靠；真机测试必须开系统旁白（iOS）或 TalkBack（Android），不能只看模拟器
最常被忽略的其实是「名称计算（Name Computation）」逻辑：屏幕阅读器最终读什么，取决于 aria-labelledby → aria-label → 元素内文本 → 默认角色名 的逐级回退规则。不验证 Name Computation，等于只写了代码，没确认效果。
