如何查看事件侦听器

DOM 资源管理器的**“事件”**选项卡显示与 DOM 元素关联的事件。每个顶部节点都表示一个具有活动订户的事件。顶部节点包含若干子节点,表示为特定事件注册的事件侦听器。使用此选项卡除了可查看事件侦听器之外,还可导航至事件侦听器在 JavaScript 代码中的位置。

**“事件”选项卡上的列表是动态的。如果在应用程序运行时添加事件,则列表中将显示该新事件。“事件”**选项卡上不显示针对非 DOM 元素的代码元素(如 xhr)的事件侦听器。

若要查看事件侦听器,请执行以下操作

  1. 在 Visual Studio 中,创建一个使用“拆分应用程序”项目模板的 JavaScript 应用程序。

  2. 在 Visual Studio 中打开该模板后,在调试器中“调试”工具栏上**“启动调试”按钮旁的下拉列表中选择“模拟器”**。下面显示此列表:

    在模拟器中运行

  3. 按 F5 以在调试模式下运行应用程序。

  4. 切换到 Visual Studio(Alt+Tab 或 F12)。

  5. 在 DOM 资源管理器中,单击 BODY 元素(或使用箭头键选择该元素)。

  6. 在 DOM 资源管理器右侧的窗格中,单击**“事件”**选项卡。

    现在可看到具有 BODY 元素的活动订户的事件,如下图所示。

    DOM 资源管理器的“事件”选项卡

    若要查找这些事件的事件侦听器,请单击关联的 JavaScript 文件链接。

请参见

概念

快速入门:调试应用程序 (JavaScript)

如何检查 CSS 规则

如何查看和编辑布局