如何在同一页面上加载动态脚本后调​​试非动态脚本

Question

这个答案/sf/answers/765060131/ 这个问题可以通过类似的WebKit,萤火虫或IE8开发工具一些调试器来调试动态加载的JavaScript？是调试动态脚本的地方.

我面临的问题是我有一个页面上有一个脚本,并且在它加载ajax请求后会触发一些HTML和一个放入页面的脚本.//# sourceURL=myDynamicDocumentFragment.html添加该位后,我可以调试动态脚本.

但是一旦它被加载,那么最初加载的外部页面的另一个脚本就会脱轨.我可以在空行上设置断点,不能在合法的行上设置它们.调试器将停止在它们上,但它不会出现在我期望的代码中.

它似乎是开发工具窗口显示原始脚本,调试器本身正在运行其他东西 - 一些更新版本的代码,包括外部页面的脚本和稍后添加的动态脚本.或者它可能只是显示它正在显示的行号以及它们实际运行的代码中映射的内容.

我希望我有一个很好的简单代码片段来演示这个问题,但我没有.有没有人看过这个,有没有人知道如何让Chrome'刷新'开发工具脚本/调试器而无需刷新页面？(它必须不刷新页面,因为当页面加载时工作正常 - 只有在动态脚本被丢弃后才会轮到车轮掉下来)

注意:我已经使用Chrome标记了,因为我正在使用它(第38节).我不知道其他浏览器的表现如何.

Answer 1

你可以找到注入head或evaluated的脚本，这里是youtube上evaluated（另一个js文件）上添加的断点。

您也可以在 Chrome 中找到此内容，添加 console.log（单击显示的消息），瞧，您拥有可以添加断点的源代码。

这里 mozila 在 utube 页面上打印评估脚本的调试/断点：

更新

抱歉，我知道 chrome 超出了范围，我的英语:)

我如何通过注入的脚本在 chrome 上进行调试，但在某些情况下，如果脚本处于活动状态（页面加载加上几毫秒），则无法附加到执行，您需要寻找解决方法。在注入的脚本的开头添加了以下内容：

//@ sourceURL=jseinjectedsource.js
console.log("evaluated");

瞧控制台：

更好地检查这种方式比我的解释chrome 开发人员更好