Computer >> Máy Tính >  >> Lập trình >> HTML

Phương thức HTML DOM addEventListener ()

Phương thức HTML DOM addEventListener () được sử dụng để đính kèm một trình xử lý sự kiện vào phần tử được chỉ định.

Sau đây là cú pháp -

element.addEventListener(event, function, capture)

Ở trên, các tham số bao gồm -

  • sự kiện: Tên của sự kiện. Bắt buộc.
  • chức năng: Hàm chạy khi sự kiện xảy ra. Bắt buộc.
  • nắm bắt: Liệu sự kiện có nên được thực thi trong giai đoạn chụp hay không. Điều này sẽ kiểm tra và hiển thị một giá trị boolean; đúng hay sai.

Bây giờ chúng ta hãy xem một ví dụ để triển khai phương thức DOM addEventListener () -

Ví dụ

<!DOCTYPE html>
<html>
<body>
<h2>Demo Heading</h2>
<button id="btn">Click</button>
<p id="myid"></p>
<script>
   var x = document.getElementById("btn");
   x.addEventListener("mouseover", one);
   x.addEventListener("click", two);
   function one() {
      document.getElementById("myid").innerHTML += "Button hovered! "
   }
   function two() {
      document.getElementById("myid").innerHTML += "!!Button Clicked!! "
   }
</script>
</body>
</html>

Đầu ra

Phương thức HTML DOM addEventListener ()

Bây giờ, nếu bạn nhấp vào, thông báo “Đã nhấp vào nút” sẽ được hiển thị. Khi di chuột qua nút, dòng chữ sau sẽ được hiển thị:“Nút được di chuột qua” -

Phương thức HTML DOM addEventListener ()