首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何在浏览器的调试器中调试动态加载的JavaScript (使用jQuery)?

如何在浏览器的调试器中调试动态加载的JavaScript (使用jQuery)?
EN

Stack Overflow用户
提问于 2012-02-01 15:08:40
回答 3查看 46.7K关注 0票数 97

动态添加的脚本未显示在浏览器的调试器的脚本部分中。

解释:

我需要使用并且已经使用过

代码语言:javascript
复制
if( someCondition == true ){
   $.getScript("myScirpt.js", function() {
       alert('Load Complete');
       myFunction();
   });
}

这样myScript.js就可以在满足某些条件时动态加载...只有在加载了整个脚本之后,才能调用myFunction ...

但是浏览器不会在调试器的脚本部分显示动态加载的myScript.js。

有没有其他方法可以实现所有的目标,使人们能够在浏览器中调试动态加载的脚本?

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2013-01-03 08:18:50

您可以为动态加载的脚本命名,这样它就会显示在Chrome/Firefox JavaScript调试器中。要做到这一点,您需要在脚本末尾添加注释:

代码语言:javascript
复制
//# sourceURL=filename.js

然后,此文件将在“源”选项卡中显示为filename.js。根据我的经验,您可以在名称中使用's,但如果使用/'s,则会出现奇怪的行为。

由于如果没有指定一个域,它将出现在名为"(no filename.js )“的文件夹中,因此可以方便地指定一个域来改善调试体验,例如,要查看”自定义“文件夹,可以使用:

代码语言:javascript
复制
//# sourceURL=browsertools://custom/filename.js

下面是一个完整的示例:

代码语言:javascript
复制
window.helloWorld = function helloWorld()
{
  console.log('Hello World!');
}
//# sourceURL=browsertools://custom/helloWorld.js

有关详情,请参阅:Breakpoints in Dynamic JavaScript deprecation of //@sourceurl

票数 216
EN

Stack Overflow用户

发布于 2014-05-21 04:55:51

我尝试使用OP建议的变通方法"//# sourceURL=filename.js“,但它仍然没有出现在源面板中,除非它已经存在于我以前的标签页中,因为它产生了一个异常。

编写"debugger;“行强制它在该位置中断。然后,一旦它出现在我的源面板的标签中,我就可以像正常一样设置断点,并删除"debugger;“行。

票数 15
EN

Stack Overflow用户

发布于 2019-07-11 01:12:43

当试图在IE中跟踪这类事情时,我打开了开发工具(F12),然后在控制台中使用以下行查找放置断点的位置:

代码语言:javascript
复制
debugger;myFunction();

这将切换到调试器选项卡,您可以在其中单步执行myFunction()并设置断点。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9092125

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档