HTML DOM addEventListener() 方法

htmlweb developmentfront end technology更新于 2025/6/16 18:52:17

HTML DOM addEventListener() 方法用于将事件处理程序附加到指定元素。

以下是语法 −

element.addEventListener(event, function, capture)

以上参数包含 −

event: 事件名称。必填。
function: 事件发生时运行的函数。必填。
capture: 事件是否应在捕获阶段执行。此检查并显示布尔值;true 或 false。

现在让我们看一个实现 DOM addEventListener() 方法的示例 −

示例

<!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>