使用chromes网站检查器查看代码非常有用。但是您如何查看例如按钮的悬停代码？您将不得不将鼠标悬停在按钮上，因此无法在检查器中使用它（鼠标）。在检查器中是否有任何快捷方式或其他方法可以完成此操作？

现在，您既可以看到伪类样式规则，也可以将它们强制应用于元素。

要查看“ :hover样式”窗格中的规则，请单击右上角的小虚线框按钮。

要强制某个元素进入:hover状态，请右键单击它。

或者，您可以使用“脚本”面板中的“事件侦听器断点”侧栏窗格，并选择在鼠标悬停处理程序中暂停。

或者，您可以使用“脚本”面板中的“事件侦听器断点”侧栏窗格，并选择在鼠标悬停处理程序中暂停。

有点烦人，但是您需要右键单击该元素，然后将鼠标悬停在链接上，使用键盘选择“检查元素”链接，然后按Enter。这应该显示所选元素的悬停伪类的css。

希望他们在以后的构建中使此操作变得容易一些。

在Chrome中：

您也可以将鼠标悬停在某个元素上，然后单击CTRL+SHIFT+C以检查该元素。

在Firefox中：

在萤火虫中：

来源：https : //stackoverflow.com/a/11272205/2165415

我不确定我是否正确理解了您的问题，但是如果您想查看事件处理程序代码，则可以仅检查元素并查看“元素面板”的“事件侦听器”侧栏窗格。另一种方法是在脚本面板中按暂停按钮，然后将鼠标悬停在元素上。调试器将在第一个事件处理程序的第一条指令处停止。

请在下面的链接上查看答案

请参阅Chrome开发者工具中的：hover状态