06/04/2021, 14:48
Hàm document.addEventListener() trong Javascript - Javascript Function
Code RUN <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style type="text/css"> </style> </head> <body> <h1>Học lập trình miễn phí tại Zaidap.com.net</h1> ...
Phương thức document.addEventListener() sẽ gắn một sự kiện và phương thức xử lý sự kiện cho cả trang. Sử dụng phương thức document.removeEventListener() để xóa bỏ sự kiện đã được gán trước đó bời phương thức document.addEventListener().
Nếu bạn muốn gán một sự kiện cho một phần tử xác định trong trang, sử dụng phương thức element.addEventListener().
Cú pháp
Cú pháp: document.addEventListener(event, function, useCapture)
Trong đó:
- event là tên sự kiện. Lưu ý không sử dụng tiền tố on, ví dụ "onclick" sẽ được thay thế bằng "click".
- function là hàm xử lý cho sự kiện event. Khi sự kiện xảy ra, một event Object sẽ được truyền vào function như tham số đầu tiên. Kiểu của event Objdect phụ thuộc vào tham số event. Ví dụ sự kiện "click" sẽ thuộc vào MouseEvent object.
- useCapture Là một tham số không bắt buộc, quy định cách thức thực thi mã lệnh trong function.
Cách sử dụng
Sử dụng phương thức document.addEventListener() để gán sự kiện khi người dùng "click" vào trang thì sẽ hiển thị popup có nội dung "Chào mừng bạn đến với Zaidap.com.net":
Code
RUN
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
</style>
</head>
<body>
<h1>Học lập trình miễn phí tại Zaidap.com.net</h1>
<p>Các bạn click vào bất cứ điểm nào trên trang để hiện thị lời chào</p>
<button>Thẻ Button</button>
<script>
document.addEventListener("click", function(){
alert("Chào mừng bạn đến với Zaidap.com.net");
});
</script>
</body>
</html>Tham khảo: w3schools.com
Nguồn: Zaidap.com.net
