从我最近的问题中,我已经为动态加载部分视图创建了一些JavaScript函数。但是我无法调试任何动态加载的JavaScript。因为所有加载的JavaScript都将由"eval"函数评估。
我发现一种方式是使用以下脚本来动态创建脚本到当前文档的头部。所有加载的脚本都将显示在HTML DOM中(您可以使用任何调试器找到它)。
var script = document.createElement('script')
script.setAttribute("type","text/javascript")
script.text = "alert('Test!');";
document.getElementsByTagName('head')[0].appendChild(script);
顺便说一下,大多数调试器(IE8开发者工具栏、Firebug和Google Chrome)无法在任何动态脚本中设置断点。因为可调试的脚本必须在页面加载后第一次加载。
当使用动态脚本内容或动态文件时,您有没有关于调试的想法?
更新1-添加用于测试的源代码
您可以使用以下xhtml文件来尝试调试someVariable值。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Dynamic Loading Script Testing</title>
<script type="text/javascript">
function page_load()
{
var script = document.createElement('script')
script.setAttribute("id", "dynamicLoadingScript");
script.setAttribute("type","text/javascript");
script.text = "var someVariable = 0;\n" +
"someVariable = window.outerWidth;\n" +
"alert(someVariable);";
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
</head>
<body onload="page_load();">
</body>
</html>
根据回答,我在FireBug中进行了测试。结果应该显示如下所示的图片。
请查看页面加载后添加的“dynamicLoadingScript”。
但是它在FireBug的脚本选项卡中找不到。
更新2 - 在动态加载脚本中创建调试断点
以上两张图片显示在脚本的某一行中插入“debugger;”语句可以在动态加载脚本中触发断点。然而,两个调试器都不会在断点处显示任何代码。因此,这是无用的。
谢谢