Firebug：如何检查无法点击的元素？

Posted 2023-05-08

【中文标题】Firebug：如何检查无法点击的元素？

【英文标题】：Firebug: How can I inspect an element I can't click on?

【发布时间】：2011-09-24 13:06:50

【问题描述】：

我正在尝试使用 Firebug 来检查当我将鼠标悬停在照片上时出现的页面元素。

问题是，元素的位置与鼠标位置是动态偏移的，所以我无法右键单击它以获取“检查元素”选项。

我曾希望onhover元素会被插入到DOM中一个合理的位置，但到目前为止，我还没有找到它。

有什么建议吗？

【问题讨论】：

注意：我不知道元素的 ID、类等——这就是我想要找出的。

【参考方案1】：

如果您知道 在 DOM 中的何处，新元素将被创建（通常这些元素被创建为 body 元素的子元素），您可以在创建时设置断点.

假设该元素将作为body 元素的子元素创建。如果您按照以下步骤操作，您将能够检查该元素：

加载页面 激活 FireBug 的 html 面板 找到body 元素 右键单击body 元素并从弹出菜单中选择Break on Child Addition or Removal 将鼠标悬停在您的照片上以触发所需元素的创建

脚本执行应在元素创建后立即中断。届时，您将拥有所有需要检查动态创建的元素的时间，即使在 HTML 面板中也是如此。

【讨论】：

哇，这太巧妙了，谢谢。我刚刚检查了一下，似乎 Chrome 也有这个功能。这确实会派上用场。 :)

顺便说一句，这个解决方案很棒，但是我试图检查的页面在 body 元素上有数百个突变，我想要捕获的事件很难预测它何时会发生，我真正想要的是一种在元素弹出时使用键盘快捷键或小书签冻结 dom 的方法，这样我就可以检查冻结的临时弹出元素。我要检查的元素随机弹出。

【参考方案2】：

这不是一个理想的解决方案，但您可以调查 onhover 代码以了解有关正在创建的元素的更多信息。该信息可能允许您在 Firebug 的 DOM 查看器中找到它。

【讨论】：

我最终只是仔细研究了 DOM 查看器中的代码以找到无法触及的元素，但我以后会使用这个建议。

【参考方案3】：

您可以使用萤火虫窗口顶部的搜索栏搜索元素吗？

【参考方案4】：

您可以使用 CTRL+F 在代码视图中找到它。