跟踪元素焦点

Kayce Basques
Kayce Basques
Alexandra Klepper
Alexandra Klepper

假设您正在测试某个网页的键盘导航无障碍功能。 使用 Tab 键浏览网页时,焦点环有时会消失,因为获得焦点的元素处于隐藏状态。如需在开发者工具中跟踪焦点元素,请执行以下操作:

  1. 打开控制台
  2. 点击 Create Live Expression

    创建实时表情。

    如需了解详情,请参阅使用实时表达式实时查看 JavaScript 值

  3. 输入 document.activeElement

  4. 点击实时表情界面之外的区域即可保存。

document.activeElement 后面的值是表达式的结果。由于该表达式始终表示具有焦点的元素,因此您可以跟踪哪个元素具有焦点。

  • 将鼠标悬停在结果上,以突出显示视口中的焦点元素。
  • 右键点击相应结果,然后选择在“元素”面板中打开,以在元素面板的 DOM 树中显示相应元素。
  • 右键点击结果,然后选择 Store as global variable(存储为全局变量),以创建对您可在控制台中使用的节点的变量引用。