Phương thức document.addEventListener()
thêm một đoạn chương trình xử lý sự kiện vào đối tượng document.
Bạn cũng có thể sử dụng phương thức element.addEventListener()
để đính kèm một trình xử lý sự kiện vào một phần tử được chỉ định.
Tóm Tắt
Cú pháp
event
Bắt buộc.
Một chuỗi chỉ định tên của sự kiện.
Lưu ý: Không sử dụng tiền tố on
. Ví dụ: sử dụng click
thay vì onclick
.
function
Bắt buộc.
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 đối tượng sự kiện phụ thuộc vào sự kiện được chỉ định. Ví dụ: sự kiện click
thuộc đối tượng MouseEvent
.
Giá trị trả về
Không có giá trị trả về
Phiên bản DOM: DOM Level 2 Events
Ví dụ
Gắn sự kiện nhấp chuột vào document. Khi người dùng nhấp vào bất kỳ đâu trong trang HTML, xuất câu Hello World
vào phần tử <p>
có id="demo"
:
<!DOCTYPE html> <html> <body> <p>This example uses the addEventListener() method to attach a click event to the document.</p> <p>Click anywhere in the document.</p> <p><strong>Note:</strong> The addEventListener() method is not supported in Internet Explorer 8 and earlier versions.</p> <p id="demo"></p> <script> document.addEventListener("click", function() { document.getElementById("demo").innerHTML = "Hello World!"; }); </script> </body> </html>
Bạn cũng có thể tham chiếu tới một hàm được đặt khai báo ở đâu đó:
<!DOCTYPE html> <html> <body> <p>This example uses the addEventListener() method to execute a function when a user clicks anywhere in the document.</p> <p id="demo"></p> <script> document.addEventListener("click", myFunction); function myFunction() { document.getElementById("demo").innerHTML = "Hello World"; } </script> </body> </html>