数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何捕获所有 JavaScript 错误？
为了捕获所有 JavaScript 错误，我们可以使用 window.onerror() 方法，它就像一个全局的 try-catch 语句。onerror 事件处理程序是第一个用于简化 JavaScript 错误处理的功能。每当页面上发生异常时，都会在窗口对象上触发错误事件。
onerror 事件处理程序提供三条信息来识别错误的确切性质：
错误消息 - 浏览器为给定错误显示的相同消息
URL - 发生错误的文件
行号 - 给定 URL 中导致错误的行号
语法
以下是使用 window.onerror 方法捕获所有 JavaScript 错误的语法：
window.onerror = function (event, souce, lineno, colon, error) { }
或
Window.addEventListener( "error" , ( ErrorEvent ) => { })
在这里我们可以看到两种语法都在做同样的事情，但在 onerror 中接收五个参数，而 addEventListener 接收一个参数，该参数包含了 onerror 的所有五个属性，这些属性如下：
event - 以字符串形式描述问题的可读错误消息。
source - 生成错误的脚本文件的 URL。它也以字符串形式表示。
lineno - 生成错误的脚本文件的行号。它是整数格式。
colon - 生成错误的脚本文件的列号。它是整数格式。
error - 这是抛出的错误对象。
注意：window.onerror 仅接收五个参数，当涉及到 Element.onerror 时，我们只接收一个 ErrorEvent 对象。
步骤
要使用 window.onerror 事件处理程序捕获所有 JavaScript 错误，请按照以下步骤操作：
步骤 1 - 在文本编辑器中打开 HTML 文件
步骤 2 - 在 HTML 中添加一个元素，您希望在其中显示错误消息。您可以使用带有 id 属性的 div 元素，如下所示
步骤 3 - 在 HTML 中添加一个脚本元素并定义 window.onerror 事件处理程序函数。每当 JavaScript 代码中发生错误时，都会调用此函数。
步骤 4 - 您可以使用这些参数在 HTML 元素中显示错误详细信息。
步骤 5 - 在 HTML 中添加一个按钮或任何其他元素，该元素将触发错误。您可以使用 onclick 事件处理程序来调用生成错误的函数。
示例：使用 window.onerror() 方法
在此示例中，我们创建一个输入标签，并在单击输入标签时调用一个不存在的函数，并通过使用 window.onerror 打印错误。
<html>
<head>
<h2> Catching all JavaScript errors using window.onerror </h2>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="myFunc();" />
</form>
<div id = "result"><div>
<script>
window.onerror = function (error, source, lineno, colno, error) {
// Print the error message
let output = document.getElementById("result");
output.innerHTML += "Message : " + error + "<br>";
// Print the url of the file that contains the error
output.innerHTML += "Url : " + source + "<br>";
// Print the line number from which the error generated
output.innerHTML += "Line number : " + lineno + "<br>";
// Print the column number of the error line
output.innerHTML += "Column number : " + colno + "<br>";
// Print he error object
output.innerHTML += "Error Object : " + error;
}
</script>
</body>
</html>
示例 2：使用 window.adEventListener() 方法
这与第一个示例相同，但我们使用 addEventListener 而不是 onerror。
<html>
<body>
<h2> Catching all JavaScript errors using addEventListener </h2>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="myFunc();" />
</form>
<div id = "result"></div>
<script>
num = 20;
window.addEventListener("error", (ErrorEvent) => {
let output = document.getElementById("result");
// Print the error message
output.innerHTML += "Message : " + ErrorEvent.message + "<br>";
// Print the url of the file that contains the error
output.innerHTML += "Url : " + ErrorEvent.filename + "<br>";
// Print the line number from which the error generated
output.innerHTML += "Line number : " + ErrorEvent.lineno + "<br>";
// Print the column number of the error line
output.innerHTML += "Column number : " + ErrorEvent.colno + "<br>";
// Print he error object
output.innerHTML += "Error Object : " + ErrorEvent.error;
})
</script>
</body>
</html>
总而言之，要捕获所有 JavaScript 错误，可以使用 window.onerror 方法或 window.addEventListener 方法。这些方法就像一个全局的 try-catch 语句，并在 JavaScript 代码中发生错误时触发。
11K+ 次查看
