Web 可访问性值（Accessibility Value）

1. 基础概念
   Web 可访问性值（Accessibility Value）是 WAI-ARIA 规范中定义的属性，用于描述可交互组件的当前数值状态。它通常应用于进度条、滑块、滚动条、旋钮等需要表达数值范围的元素。例如，一个音量滑块的最小值为 0，最大值为 100，当前值可能为 75。该值通过辅助技术（如屏幕阅读器）向用户宣告，帮助视障用户理解组件的状态。

2. 核心属性与关联角色
   可访问性值主要通过 aria-valuenow、aria-valuemin、aria-valuemax 三个属性定义：

   • aria-valuenow：当前数值（必需）
   • aria-valuemin：最小值（默认 0）
   • aria-valuemax：最大值（默认 100）
     这些属性需与支持值的 ARIA 角色结合使用，例如：
   • role="slider"（滑块）
   • role="progressbar"（进度条）
   • role="scrollbar"（滚动条）
   • role="spinbutton"（数字输入框）

3. 值的动态更新机制
   当用户操作导致数值变化时，必须通过 JavaScript 实时更新 aria-valuenow。例如拖动滑块时，应触发以下流程：

   • 监听用户输入事件（如 mousemove 或 touchmove）
   • 计算新值并更新 aria-valuenow
   • 同步更新组件的视觉表现（如滑块位置）
   • 屏幕阅读器会自动读取变化后的值（部分需配合 aria-live 区域）

4. 与 HTML 原生元素的协作
   若使用原生 HTML 元素（如 <input type="range">），浏览器会自动管理可访问性值，无需额外添加 ARIA 属性。但在自定义组件中（如用 <div> 实现的滑块），必须显式声明 ARIA 值属性，否则辅助技术无法识别数值范围。

5. 值格式与国际化考量
   数值可包含单位（如 aria-valuetext="75%"），通过 aria-valuetext 属性替代纯数字显示。例如温度滑块可设置为 aria-valuetext="25摄氏度"。需注意单位描述的本地化，确保屏幕阅读器以用户语言播报。

6. 辅助技术交互示例
   屏幕阅读器遇到以下代码：

   <div role="slider" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" aria-label音量控制">
   

   会播报：“音量控制滑块，50”。若用户用键盘箭头调整值至 75，屏幕阅读器将实时播报：“75”。

7. 无障碍测试验证
   开发中需通过以下方式验证值是否正确传递：

   • 使用浏览器开发者工具的“无障碍检查器”
   • 配合 NVDA、VoiceOver 等屏幕阅读器实际操作测试
   • 确保键盘操作时值的变化符合 aria-valuenow 更新逻辑