Hướng dẫn which event occurs when there is a javascript error? - sự kiện nào xảy ra khi có lỗi javascript?

Question

Sự kiện error được kích hoạt trên đối tượng Window khi tài nguyên không tải hoặc không thể được sử dụng - ví dụ nếu tập lệnh có lỗi thực thi.

Nội dung chính Show

Loại sự kiện
Ghi chú sử dụng
Ví dụ trực tiếp
Thông số kỹ thuật
Tính tương thích của trình duyệt web
Điều gì xảy ra khi JavaScript ném lỗi?
Những lỗi nào xảy ra trong JavaScript?
Lỗi phổ biến nhất trong JavaScript là gì?
Tại sao các lỗi JavaScript xảy ra?

Cú pháp

Sử dụng tên sự kiện trong các phương thức như addEventListener() hoặc đặt thuộc tính Trình xử lý sự kiện.

addEventListener("error", (event) => {});

onerror = (event, source, lineno, colno, error) => {};

Lưu ý: Vì lý do lịch sử, onerror trên window là tài sản xử lý sự kiện duy nhất nhận được nhiều hơn một đối số. Due to historical reasons, onerror on window is the only event handler property that receives more than one argument.

Loại sự kiện

Đối tượng sự kiện là một thể hiện UIEvent nếu nó được tạo từ phần tử giao diện người dùng hoặc một phiên bản ____10 khác.

Sự kiện Uievent

Ghi chú sử dụng

Không giống như các sự kiện khác, sự kiện error bị hủy bằng cách trả lại

<div class="controls">
  <button id="script-error" type="button">Generate script errorbutton>
  <img class="bad-img" />
div>

<div class="event-log">
  <label for="eventLog">Event log:label>
  <textarea
    readonly
    class="event-log-contents"
    rows="8"
    cols="30"
    id="eventLog">textarea>
div>

2 từ trình xử lý thay vì trả lại

<div class="controls">
  <button id="script-error" type="button">Generate script errorbutton>
  <img class="bad-img" />
div>

<div class="event-log">
  <label for="eventLog">Event log:label>
  <textarea
    readonly
    class="event-log-contents"
    rows="8"
    cols="30"
    id="eventLog">textarea>
div>

3. Khi bị hủy, lỗi sẽ không xuất hiện trong bảng điều khiển, nhưng tập lệnh hiện tại vẫn sẽ ngừng thực thi.

Chữ ký của người xử lý sự kiện không đối xứng giữa addEventListener() và onerror. Trình xử lý sự kiện được chuyển đến

<div class="controls">
  <button id="script-error" type="button">Generate script errorbutton>
  <img class="bad-img" />
div>

<div class="event-log">
  <label for="eventLog">Event log:label>
  <textarea
    readonly
    class="event-log-contents"
    rows="8"
    cols="30"
    id="eventLog">textarea>
div>

6 nhận được một đối tượng

<div class="controls">
  <button id="script-error" type="button">Generate script errorbutton>
  <img class="bad-img" />
div>

<div class="event-log">
  <label for="eventLog">Event log:label>
  <textarea
    readonly
    class="event-log-contents"
    rows="8"
    cols="30"
    id="eventLog">textarea>
div>

7 duy nhất, trong khi trình xử lý onerror nhận được năm đối số, khớp với các thuộc tính của đối tượng

<div class="controls">
  <button id="script-error" type="button">Generate script errorbutton>
  <img class="bad-img" />
div>

<div class="event-log">
  <label for="eventLog">Event log:label>
  <textarea
    readonly
    class="event-log-contents"
    rows="8"
    cols="30"
    id="eventLog">textarea>
div>

7:

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

0

Một chuỗi chứa thông báo lỗi có thể đọc được của con người mô tả vấn đề. Giống như

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

1.

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

2

Một chuỗi chứa URL của tập lệnh tạo ra lỗi.

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

3

Một số nguyên chứa số dòng của tệp tập lệnh mà lỗi xảy ra.

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

4

Một số nguyên chứa số cột của tệp tập lệnh mà lỗi xảy ra.

error

Lỗi bị ném. Thường là một đối tượng

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

6.

Lưu ý: Các tên tham số này có thể quan sát được với thuộc tính Trình xử lý sự kiện HTML, trong đó tham số đầu tiên được gọi là

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

0 thay vì
body { display: grid; grid-template-areas: "control log"; } .controls { grid-area: control; display: flex; align-items: center; justify-content: center; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } button { height: 2rem; margin: 0.5rem; } img { width: 0; height: 0; }
8. These parameter names are observable with an HTML event handler attribute, where the first parameter is called

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

0 instead of

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

8.

Hành vi đặc biệt này chỉ xảy ra đối với trình xử lý sự kiện onerror trên window. Trình xử lý

const log = document.querySelector(".event-log-contents");

window.addEventListener("error", (event) => {
  log.textContent = `${log.textContent}${event.type}: ${event.message}\n`;
  console.log(event);
});

const scriptError = document.querySelector("#script-error");
scriptError.addEventListener("click", () => {
  const badCode = "const s;";
  eval(badCode);
});

1 vẫn nhận được một đối tượng

<div class="controls">
  <button id="script-error" type="button">Generate script errorbutton>
  <img class="bad-img" />
div>

<div class="event-log">
  <label for="eventLog">Event log:label>
  <textarea
    readonly
    class="event-log-contents"
    rows="8"
    cols="30"
    id="eventLog">textarea>
div>

7 duy nhất.

Ví dụ

Ví dụ trực tiếp

HTML

<div class="controls">
  <button id="script-error" type="button">Generate script errorbutton>
  <img class="bad-img" />
div>

<div class="event-log">
  <label for="eventLog">Event log:label>
  <textarea
    readonly
    class="event-log-contents"
    rows="8"
    cols="30"
    id="eventLog">textarea>
div>

body {
  display: grid;
  grid-template-areas: "control log";
}

.controls {
  grid-area: control;
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-log {
  grid-area: log;
}

.event-log-contents {
  resize: none;
}

label,
button {
  display: block;
}

button {
  height: 2rem;
  margin: 0.5rem;
}

img {
  width: 0;
  height: 0;
}

JavaScript

const log = document.querySelector(".event-log-contents");

window.addEventListener("error", (event) => {
  log.textContent = `${log.textContent}${event.type}: ${event.message}\n`;
  console.log(event);
});

const scriptError = document.querySelector("#script-error");
scriptError.addEventListener("click", () => {
  const badCode = "const s;";
  eval(badCode);
});

Kết quả

Thông số kỹ thuật

Sự chỉ rõ
HTML Standard # Event-error # event-error
HTML Standard # Handler-Onerror # handler-onerror

Tính tương thích của trình duyệt web

Bảng BCD chỉ tải trong trình duyệt

Xem thêm

Sự kiện này trên

const log = document.querySelector(".event-log-contents");

window.addEventListener("error", (event) => {
  log.textContent = `${log.textContent}${event.type}: ${event.message}\n`;
  console.log(event);
});

const scriptError = document.querySelector("#script-error");
scriptError.addEventListener("click", () => {
  const badCode = "const s;";
  eval(badCode);
});

3 Mục tiêu: error Sự kiện

Điều gì xảy ra khi JavaScript ném lỗi?

Khi xảy ra lỗi, JavaScript thường sẽ dừng và tạo thông báo lỗi. Thuật ngữ kỹ thuật cho điều này là: JavaScript sẽ ném một ngoại lệ (ném lỗi). JavaScript thực sự sẽ tạo một đối tượng lỗi với hai thuộc tính: tên và tin nhắn.JavaScript will normally stop and generate an error message. The technical term for this is: JavaScript will throw an exception (throw an error). JavaScript will actually create an Error object with two properties: name and message.

Những lỗi nào xảy ra trong JavaScript?

Có ba loại lỗi chính có thể xảy ra trong khi biên dịch chương trình JavaScript: lỗi cú pháp, lỗi thời gian chạy và lỗi logic.syntax errors, runtime errors, and logical errors.

Lỗi phổ biến nhất trong JavaScript là gì?

TypeError là một trong những lỗi phổ biến nhất trong các ứng dụng JavaScript.Lỗi này được tạo ra khi một số giá trị không hóa ra là một loại dự kiến cụ thể.Một số trường hợp phổ biến khi nó xảy ra là: gọi các đối tượng không phải là phương pháp. is one of the most common errors in JavaScript apps. This error is created when some value doesn't turn out to be of a particular expected type. Some of the common cases when it occurs are: Invoking objects that are not methods.

Tại sao các lỗi JavaScript xảy ra?

Các lỗi này xảy ra khi công cụ JavaScript đang phân tích tập lệnh và gặp mã không hợp lệ về mặt cú pháp.Nếu tệp JavaScript chứa lỗi cú pháp, không có mã nào trong tệp sẽ thực thi.Mã này không chỉ tạo ra một lỗi, mà cả bảng điều khiển.Đăng nhập trước cú pháp không hợp lệ thậm chí sẽ không chạy.when the JavaScript engine is parsing a script and encounters syntactically invalid code. If a JavaScript file contains a syntax error, none of the code in the file will execute. Not only will this code produce an error, but the console. log before the invalid syntax won't even run.

programming javascript Window onerror Custom error js JS event

Hướng dẫn which event occurs when there is a javascript error? - sự kiện nào xảy ra khi có lỗi javascript?

Cú pháp

Loại sự kiện

Ghi chú sử dụng

Ví dụ

Ví dụ trực tiếp

HTML

JavaScript

Kết quả

Thông số kỹ thuật

Tính tương thích của trình duyệt web

Xem thêm

Điều gì xảy ra khi JavaScript ném lỗi?

Những lỗi nào xảy ra trong JavaScript?

Lỗi phổ biến nhất trong JavaScript là gì?

Tại sao các lỗi JavaScript xảy ra?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội