Một sự kiện là một phần quan trọng của .Một trang web phản hồi theo một sự kiện đã xảy ra. Một số sự kiện do người dùng tạo và một số sự kiện được tạo bởi API. Trong bài viết này, chúng ta sẽ xem các sự kiện xảy ra như thế nào và phương thức addEventListener trong JavaScript được sử dụng như thế nào trong trình tự sau:
- Trình xử lý sự kiện là gì?
- AddEventListener () trong JavaScript
- Giá trị tham số
- AddEventListener trong JavaScript: Ví dụ
Trình xử lý sự kiện là gì?
Trình xử lý sự kiện là một thủ tục trong JavaScript chờ một sự kiện xảy ra. Ví dụ đơn giản của một biến cố là người dùng nhấp chuột hoặc nhấn một phím trên bàn phím.
Các addEventListener () là một xây dựng Hàm JavaScript lấy sự kiện để lắng nghe và đối số thứ hai được gọi bất cứ khi nào sự kiện được mô tả được kích hoạt. Có thể thêm bất kỳ số lượng trình xử lý sự kiện nào vào một phần tử duy nhất mà không cần ghi đè các trình xử lý sự kiện hiện có.
.trim () java
addEventListener () trong JavaScript
Một số đặc trưng của phương pháp lắng nghe sự kiện bao gồm:
- Các addEventListener () phương pháp đính kèm một xử lý sự kiện đến phần tử được chỉ định.
- Phương thức này đính kèm một trình xử lý sự kiện vào một phần tử không có ghi đè trình xử lý sự kiện hiện có.
- Bạn có thể thêm nhiều người xử lý sự kiện thành một phần tử.
- Bạn có thể thêm nhiều trình xử lý sự kiện của cùng loại đến một thành phần , tức là hai sự kiện “nhấp chuột”.
- Người nghe sự kiện có thể được thêm vào bất kỳ KIỂM ĐỊNH đối tượng không chỉ các phần tử HTML. tức là đối tượng cửa sổ.
- Phương thức addEventListener () làm cho nó dễ dàng hơn để kiểm soát cách sự kiện phản ứng sủi bọt.
Khi sử dụng phương thức addEventListener (), JavaScript được tách khỏi đánh dấu, để dễ đọc hơn và cho phép bạn thêm trình xử lý sự kiện ngay cả khi bạn không kiểm soát đánh dấu HTML.
Ngoài ra, bạn có thể dễ dàng xóa trình nghe sự kiện bằng cách sử dụng phương thức removeEventListener () .
Cú pháp:
target.addEventListener (loại, người nghe [, tùy chọn]) target.addEventListener (loại, người nghe [, useCapture]) target.addEventListener (loại, người nghe [, useCapture, wantUntrusted])
Giá trị tham số
| Tham số | Sự miêu tả |
biến cố | Cần thiết. Chuỗi chỉ định tên của sự kiện. Lưu ý: Không sử dụng tiền tố “bật”. Ví dụ: sử dụng 'click' thay vì 'onclick'. Để có danh sách tất cả các sự kiện HTML DOM, hãy xem Tham chiếu Đối tượng Sự kiện HTML DOM hoàn chỉnh của chúng tôi. |
chức năng cách tạo một chuỗi ngẫu nhiên trong java | Cần thiết. Chỉ định hàm để chạy khi sự kiện xảy ra. Khi sự kiện xảy ra, một đối tượng sự kiện được truyền cho hàm dưới dạng tham số đầu tiên. Loại sự kiện vật phụ thuộc vào sự kiện được chỉ định. Ví dụ: sự kiện “nhấp chuột” thuộc đối tượng MouseEvent. |
useCapture | Không bắt buộc. Một giá trị Boolean chỉ định liệu sự kiện nên được thực thi trong quá trình chụp hay trong giai đoạn tạo bọt. Các giá trị có thể có: true - Trình xử lý sự kiện được thực thi trong phasefalse bắt giữ- Mặc định. Trình xử lý sự kiện được thực hiện trong giai đoạn sôi sục |
Bây giờ bạn đã biết cách hoạt động của trình xử lý sự kiện, hãy xem ví dụ về addEventListener () trong JavaScript.
cách tạo từ điển trong java
addEventListener () trong JavaScript: Ví dụ
& lt! DOCTYPE html & gt & lthtml & gt & ltbody & gt & ltp & gt Ví dụ này sử dụng phương thức addEventListener () để thực thi một chức năng khi người dùng nhấp vào nút. & lt / p & gt & ltbutton id = 'myBtn' & gtTry it & ltget / button glementt & gt, thử nó & ltget / button ('myBtn'). addEventListener ('click', myFunction) function myFunction () {document.getElementById ('demo'). innerHTML = 'Hello World'} & lt / script & gt & lt / body & gt & lt / html & gt 
Với điều này, chúng ta sẽ kết thúc addEventListener này trong JavaScript. Tôi hy vọng bạn hiểu cách người nghe sự kiện phương pháp hoạt động bằng JavaScript.
Kiểm tra của chúng tôi đi kèm với đào tạo trực tiếp do người hướng dẫn và trải nghiệm dự án thực tế. Khóa đào tạo này giúp bạn thành thạo các kỹ năng làm việc với công nghệ web back-end và front-end. Nó bao gồm đào tạo về Phát triển Web, jQuery, Angular, NodeJS, ExpressJS và MongoDB.
Có một câu hỏi cho chúng tôi? Vui lòng đề cập đến nó trong phần nhận xét của blog “addEventListener trong JavaScript” và chúng tôi sẽ liên hệ lại với bạn.