页面加载事件调试

Question

我正在开发一个大型应用程序。在我的应用程序中，一个灯箱在页面加载和刷新时打开。该应用程序中包含许多 JavaScript 个文件，并且有许多开发人员对其进行了处理。我正在尝试调试和识别导致该灯箱打开的 JS 代码，以便我可以对其进行编辑。

我尝试在 Chrome 开发者工具的 Load 中添加断点（见下图），但是当它在第一个断点处停止时，灯箱已经在屏幕上。这意味着灯箱的代码在第一次加载事件侦听器启动之前呈现。

有什么方法可以找出打开灯箱代码的位置吗？

P.S：我也不确定用于打开灯箱的确切代码语法是什么，否则我会在源文件中搜索该语法。

更新：经过进一步检查，我发现当执行 jQuery 库文件中的这些行时，会显示灯箱。

这些行似乎是事件循环触发。我不确定此信息是否对解决此问题有用。

Answer 1

您可以使用

console.trace();

要查看调用了哪些函数以到达您放入 .trace 的代码行。

既然您在 jQuery 库中发现了一个以某种方式参与开头的函数，您应该把它放在那里。

此外，您可以通过调用

在其下方放置一个代码断点

debugger;

如果还没有的话。考虑使用本地未压缩版本的 jq 以便于调试。