UD5工具箱
步骤一：确认追踪状态
打开工具页面后，首先确认工具顶部的状态栏显示"追踪中"。工具会自动覆盖页面的addEventListener方法，开始监听所有新绑定的事件。状态栏同时会显示已追踪的事件数量。
步骤二：选择目标元素
有两种方式选择要查看的元素：方式一，点击"选择元素"按钮进入选择模式，移动鼠标高亮元素后点击锁定选择；方式二，在CSS选择器输入框中输入选择器表达式（如"#myButton"或".card"），然后点击"查询元素"按钮。
步骤三：查看已选元素信息
选择元素后，工具会在"已选元素显示区域"展示所选元素的基本信息，包括元素标签名、类名、ID等属性，方便确认选择的元素是否正确。如需重新选择，可再次点击"选择元素"按钮。
步骤四：浏览事件监听器列表
在事件监听器列表区域，工具会列出所选元素上检测到的所有事件监听器。每个条目包含事件类型（如click、keydown等）和对应的处理函数信息。如果未检测到事件，工具会提示可能的原因，包括事件尚未绑定、使用了事件委托、或在追踪启动前已绑定。
步骤五：使用类型筛选功能
当元素上绑定了多个不同类型的事件时，可使用筛选功能快速过滤。点击筛选栏中的分类按钮（全部类型、click、keyboard、mouse、focus/blur、touch、form、inline），即可只显示对应类型的事件监听器，提升排查效率。
步骤六：查看函数源码
选中某个事件监听器后，工具会在函数源码面板展示该监听器对应的处理函数源代码。开发者可以直接阅读源码了解事件处理逻辑，无需在项目代码中手动搜索定位。这对于调试第三方库或遗留代码中的事件绑定问题特别有用。
步骤七：利用演示元素验证功能
工具页面底部提供了多种演示元素，涵盖常见的事件绑定场景。点击"选择元素"按钮后选择任意演示元素，即可查看其绑定的事件信息。建议初次使用时先通过演示元素熟悉工具的各项功能，再用于实际项目调试。演示元素包括：单击事件、双击事件、悬停事件、Once一次性事件、多事件绑定元素、Inline内联事件元素、捕获阶段事件元素等。