Html 如何检查浏览器调试扩展中的动态内容？

我有一个弹出窗口，当鼠标悬停在某个对象上时出现在我的站点上。一旦发生这种情况，我可以按下Chrome Ctrl-Shift-C并激活元素选择模式，然后选择弹出窗口中的任何元素。但一旦我做出选择，网页就会进入正常流程，弹出窗口立即消失，因为鼠标不再处于正确的位置

---

有可能以某种方式克服这种情况吗？例如，选择元素，但不终止选择模式？

Chrome和Firefox都可以在各自的开发工具中设置并保持设置诸如hover、active和focus之类的伪类。这使您可以像鼠标与更改伪类的元素交互一样处理页面

下面显示了在SO顶部导航栏中的文档链接上切换悬停伪类

以下是它在Chrome中的外观：

以下是Firefox中的外观：

---

我通常在devtools->sources->event listener breakpoints->mouse中为鼠标事件设置断点。它暂停js引擎，使元素保持不变，直到我恢复执行。