如何在动态添加的<script>中获取错误行号?标签

How can I get the line-number of an error in a dynamically added <script> tag?

本文关键字:取错误 获取 标签 script 添加 动态      更新时间:2023-09-26

当动态创建脚本元素并将其添加到页面时,我的错误不是给我脚本的行号,而是给我附加脚本的行号。

下面的代码在.js文件中会给你一个行号错误,无论document.appendChild(script)在哪行。如果运行该代码片段,将返回正确的行号。他们是怎么做到的?

var script = document.createElement("script");
script.innerHTML = "'n'n'n'n'n'n'nfoo.bar";  //error should be on line 8
document.head.appendChild(script)

明白了。在代码周围添加try catch效果很好

catchableScript = function(scriptText) {
    var scriptText = "try {'n"+scriptText+"'n} 'n catch(ex){console.log(ex.lineNumber-1)}";
    var script = document.createElement("script");
    script.innerHTML = scriptText;
    document.head.appendChild(script)
}
catchableScript("'n'n'n'n'n'n'nfoo.bar");

输出:8

同样,异常有更多有用的信息,但这是问题的答案。

编辑:

对于那些需要它的人,添加以下代码:

window.CURRENTLY_EVALED_SCRIPT = scriptText;
var scriptText = "try {'n"+scriptText
    +"'n} catch(ex){'n"
    +"var lineNumber = ex.lineNumber-1;'n"
    +"var errorOut = {};'n"
    +"errorOut.exception = ex;'n"
    +"errorOut.lines = window.CURRENTLY_EVALED_SCRIPT.split('''n');'n"
    +"var line = errorOut.lines[lineNumber-1];'n"
    +"console.log(ex.message+' on line''n'+line+' :: '+lineNumber, window.CURRENTLY_EVALED_SCRIPT_ELEMENT, errorOut);'n"
            +"}";
    ...
window.CURRENTLY_EVALED_SCRIPT_ELEMENT = script

将在控制台中产生如下输出:

foo is not defined on line
foo.bar :: 8, <script>, Object { exception: ReferenceError, lines: Array[8] }

你可以点击<script>去附加元素,或lines只看到所有行的数组。

当您说"行号"时,您可能指的是文件的行号。但在这种情况下,它是哪个文件?您正在动态地创建脚本,因此实际上没有脚本。

您正在创建的脚本只存在于DOM中,即您的代码的内存表示。