网页调试：如何查看鼠标悬浮时才出现的 DOM 元素？

本篇文章主要是结合我之前面试的各种经历和实战开发中遇到的问题解决经验整理的，希望这篇《网页调试：如何查看鼠标悬浮时才出现的 DOM 元素？ 》对你有很大帮助！欢迎收藏，分享给更多的需要的朋友学习~

如何查看鼠标悬浮时才出现的 DOM 元素？

在进行网页调试时，有时我们需要检查和操作仅在鼠标悬浮时才会出现的 DOM 元素。本文将介绍在使用 F12 调试工具时查看此类元素的两种方法。

方法 1：CSS 控制的元素

对于由 CSS 伪类 :hover 控制的元素，可以通过强制打开该伪类来查看：

• 在 Firefox 中，选中需要查看的元素，在样式面板的伪类列表中选中 :hover。
• 截图以供参考：
  [图片.png]

方法 2：JS 控制的元素

对于由 JavaScript 控制的元素（例如工具提示），可以通过以下步骤进行查看：

• 将开发者工具设置成独立窗口模式。
• 选中元素的上级元素。
• 将鼠标悬浮在目标元素上。
• 按下 Tab 键，即可选中目标元素。
• 截图以供参考：
  [图片.png]

到这里，我们也就讲完了《网页调试：如何查看鼠标悬浮时才出现的 DOM 元素？ 》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！