什么是aria-label，我应该如何使用它？
什么是aria-label，我应该如何使用它？
提问于 2014-02-26 19:25:59
几个小时前，我读到了aria-label属性，它：
定义了标记当前元素的字符串值。
但在我看来，这就是title属性应该做的事情。我进一步查看了Mozilla Developer Network以获取一些示例和解释，但我发现的唯一一件事是
<button aria-label="Close" onclick="myDialog.close()">X</button>它没有为我提供任何标签(所以我假设我误解了这个想法)。我在jsfiddle这里试过了。
所以我的问题是:为什么我需要aria-label，我应该如何使用它？
Stack Overflow用户
发布于 2019-04-27 02:01:16
必备组件：
Aria用于改善视障用户的用户体验。视障用户使用屏幕阅读器软件浏览应用程序，如JAWS、NVDA、..在应用程序中导航时，屏幕阅读器软件会向用户宣布内容。Aria可用于在代码中添加内容，以帮助屏幕阅读器用户了解控件的角色、状态、标签和用途
Aria不会在视觉上改变任何东西。(Aria也害怕设计师)。
标签唱段-
aria-label属性用于将标签传递给屏幕阅读器用户。通常搜索输入字段没有视觉标签(感谢设计者)。aria-label可用于将控件的标签传递给屏幕阅读器用户
使用方法：
<input type="edit" aria-label="search" placeholder="search">应用程序中没有视觉上的变化。但是屏幕阅读器可以理解控制的目的。
aria-labelledby
aria-label和aria-labelledby都用于传递标签。但是aria-labelledby可以用来引用页面中已经存在的任何标签，而aria-label则用来传递我没有直观显示的标签
方法1:
<span id="sd">Search</span>
<input type="text" aria-labelledby="sd">方法2:
aria-labelledby还可以用于为屏幕阅读器用户组合两个标签
<span id="de">Billing Address</span>
<span id="sd">First Name</span>
<input type="text" aria-labelledby="de sd">页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22039910
复制相关文章
相似问题
腾讯云开发者
