Question

当我通过AJAX动态加载包含javascript的html片段时，我无法在Chrome 22.0.1229.94的开发者工具窗口的源选项卡中看到该内容。有点儿，我去了这里

此页面显示了一个过时的示例开发人员工具窗口。在页面上有一个按钮来加载动态脚本，当你这样做时，它不会显示在源选项卡中。

作为解决方法，我发现添加

debugger;

到脚本并重新加载它将导致它在动态加载的代码中暂停，但不幸的是，所有行号都是灰色的，你不能在调试器中设置任何断点。

我在这里遗漏了什么或者什么？

谢谢，罗布

Answer 1

当您使用已动态加载的库或javascript代码时，可以使用短语

//@ sourceURL=foo.js

在您的javascript代码的开头， foo.js 是将为其分配的名称。调试器将使用该名称显示它。在chrome中也是如此，我想在firebug中也是如此。在这种情况下，您可以在动态加载的JavaScript代码中放置断点。

Answer 2

不知道这是否适用于chrome（这绝对不适合我现在，可能在过去）。

//@ sourceURL=foo.js

工作解决方案

对于通过ajax动态加载的脚本出现在Chrome源工具中，您需要在脚本文件的开头或结尾（我更喜欢）位置添加以下行：

//# sourceURL=foo.js

名称为foo.js的脚本将显示在（无域名）下拉列表

下的源选项卡左侧窗格中

- ＆GT;本地主机 - source / src

- ＆gt;（无域名） - foo.js

或者，您可以在脚本之间的任何位置添加以下行。

debugger;

在chrome中，您可以使用＆＃34;调试器; ＆＃34;调试器面板打开时在语句处断开的语句。如果调试器面板关闭，Chrome将忽略此项。

这将有助于在调试模式下停止脚本，您将在源（调试）面板中看到名称为VM ****的脚本。

希望这有帮助。

Answer 3

您可以使用// @ sourceURL。 Chrome似乎不支持内联脚本的// @ sourceURL。但是，它确实适用于eval表达式。 This article提供了有关在代码中命名eval块和命名任何匿名函数的更多详细信息。

您可以尝试嵌入脚本标记或JSONP，而不是使用eval。

Varunkumar Nagarajan

Answer 4

对我而言，它发生在nodejs项目上。

我重新启动了服务器并在新标签页中打开我的应用 tada ！..

Answer 5

或者，要解决此问题，您可以通过单击图标在单独的窗口中打开开发人员工具。现在重新加载脚本，它将按预期显示在脚本选项卡中。我知道这不是解决方案，而是一项工作。