UD5工具箱
以下是本工具涉及的核心术语解释，理解这些概念将帮助您更好地使用生成的代码并进行定制开发。
焦点陷阱（Focus Trap）
定义：一种无障碍技术，将键盘焦点限制在特定容器内循环移动。当用户按Tab键时，焦点在容器内最后一个可聚焦元素和第一个可聚焦元素之间循环，不会跳出容器。
与工具关系：本工具的核心功能就是自动生成焦点陷阱逻辑，确保模态对话框打开时键盘用户不会意外操作背景页面。
WCAG 2.1
定义：Web内容无障碍指南（Web Content Accessibility Guidelines）2.1版本，由W3C制定的国际标准。定义了使Web内容对残障人士可访问的四条原则：可感知、可操作、可理解、健壮。
与工具关系：本工具生成的代码严格遵循WCAG 2.1 AA级别标准，特别是成功标准2.4.3（焦点顺序）和2.1.2（无键盘陷阱）。
ARIA（Accessible Rich Internet Applications）
定义：一套用于增强Web内容无障碍性的HTML属性规范。通过ARIA角色、状态和属性，帮助辅助技术理解动态内容和复杂UI组件的用途和状态。
与工具关系：本工具自动生成dialog角色和aria-modal属性，确保屏幕阅读器正确识别对话框。
焦点恢复（Focus Restoration）
定义：模态对话框关闭时，将键盘焦点返回到打开对话框之前所在的元素。这是确保键盘用户不会因关闭弹窗而迷失位置的关键功能。
与工具关系：生成的JavaScript代码自动保存打开模态框时的焦点位置，并在关闭时恢复，符合WCAG 2.1成功标准2.4.3。
可聚焦元素（Focusable Elements）
定义：可以通过键盘Tab键导航到的HTML元素，包括：a标签（带href）、button、input、textarea、select，以及带有非负tabindex属性的元素。
与工具关系：焦点陷阱的实现依赖于识别容器内所有可聚焦元素，本工具自动处理元素收集和过滤逻辑。
dialog角色
定义：ARIA角色属性值，标识一个对话框组件。屏幕阅读器会将此元素宣布为对话框，并提示用户需要交互。
与工具关系：本工具在生成的模态框容器上自动添加此角色，确保辅助技术正确识别组件类型。
aria-modal属性
定义：ARIA状态属性，表示当前对话框是模态的，背景内容不可交互。屏幕阅读器会忽略背景内容，只读取对话框内的内容。
与工具关系：本工具自动为模态框添加此属性，配合焦点陷阱确保背景内容不会被意外访问。
aria-labelledby
定义：ARIA属性，用于关联对话框与其标题元素。屏幕阅读器会读取所引用元素的文本作为对话框的名称。
与工具关系：本工具自动生成此属性，关联对话框标题，提供完整的无障碍语义。
遮罩层（Backdrop）
定义：覆盖整个视口的半透明层，用于视觉上突出显示模态对话框，同时阻止用户与背景内容交互。
与工具关系：本工具生成带事件监听的遮罩层，支持点击关闭功能，并确保背景可聚焦元素被正确屏蔽。
Tab序（Tab Order）
定义：用户按Tab键时焦点移动的顺序，通常由DOM顺序和tabindex属性决定。正确的Tab序是无障碍键盘导航的基础。
与工具关系：本工具确保对话框内的元素按逻辑顺序排列，支持自然的Tab键导航流程。