Web 可访问性属性（Accessibility Attributes） Web 可访问性属性是 HTML 元素上的一组特殊属性，用于为辅助技术（如屏幕阅读器）提供关于该元素的额外语义信息。这些属性本身不会改变元素的外观或行为，但它们描述了元素的角色、状态、属性以及与其他元素的关系，使得辅助技术能够更准确地向残障用户传达信息。 这些属性主要遵循 WAI-ARIA（Web Accessibility Initiative - Accessible Rich Internet Applications）规范。WAI-ARIA 是一套由 W3C 制定的标准，旨在弥补传统 HTML 在表达复杂用户界面组件（如树形控件、标签页、实时区域等）语义时的不足。当标准的 HTML 标签（如 <button> ）无法充分描述一个自定义组件（如一个用 <div> 制作的按钮）的功能时，ARIA 属性就变得至关重要。 Web 可访问性属性主要分为三大类： 角色（Roles） ：定义了一个元素是什么类型的用户界面组件。例如， role="button" 告诉辅助技术这个元素应该被当作按钮来处理。这覆盖了元素的基本目的。 属性（Properties） ：描述了元素的特性或关系，这些特性通常是静态的。例如， aria-label 为一个元素提供一个可访问的名称，覆盖其原有的文本内容； aria-describedby 指向另一个元素的 id，该元素包含了对此元素的更详细描述； aria-labelledby 指向另一个元素的 id，该元素作为此元素的标签。 状态（States） ：描述了元素当前的、可能会动态变化的状况。例如， aria-checked="true" 表示一个复选框已被选中； aria-disabled="true" 表示一个控件当前不可用； aria-expanded="false" 表示一个可折叠区域当前是收起状态。 这些属性共同作用，在浏览器的可访问性树中构建出一个丰富的、机器可读的表示层。可访问性树是 DOM（文档对象模型）的一个子集，专门为辅助技术提供信息。当开发者正确设置了这些属性后，辅助技术（如屏幕阅读器）会读取可访问性树中的信息，而不是原始的 DOM，从而为用户提供准确的上下文和操作指导。 在实际开发中，使用这些属性的一个核心原则是“优先使用原生 HTML”。如果一个功能可以用原生的、具有内置可访问性的 HTML 元素（如 <button> 、 <input type="checkbox"> ）来实现，就应该优先使用原生元素，因为它们已经内置了正确的角色、状态和键盘交互行为。只有在创建自定义的、无法用标准 HTML 元素充分表达的复杂组件时，才需要大量依赖 ARIA 属性来补充语义。 正确使用 Web 可访问性属性对于构建包容性的 Web 应用至关重要。它确保了使用屏幕阅读器、键盘导航或其他辅助技术的用户能够感知、理解并操作网页内容，是实现 Web 内容无障碍指南（WCAG）合规性的关键技术手段。错误地使用这些属性（例如，为不具交互性的元素添加交互角色）反而会误导用户，造成比不使用更差的可访问性体验。