【js学习】addEventListener() 用法

来源：互联网发布：2017淘宝优质店铺男装编辑：程序博客网时间：2024/05/02 16:15

addEventListener() 方法用于向指定元素添加事件句柄。

addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。

你可以向一个元素添加多个事件句柄。

你可以向同个元素添加多个同类型的事件句柄，如：两个 "click" 事件。

你可以向任何 DOM 对象添加事件监听，不仅仅是 HTML 元素。如： window 对象。

addEventListener() 方法可以更简单的控制事件（冒泡与捕获）。

当你使用 addEventListener() 方法时, JavaScript 从 HTML 标记中分离开来，可读性更强，在没有控制HTML标记时也可以添加事件监听。

你可以使用 removeEventListener() 方法来移除事件的监听。

语法

第一个参数是事件的类型 (如 "click" 或 "mousedown").

第二个参数是事件触发后调用的函数。

第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。

<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><title></title><link rel="stylesheet" href=""></head><body> <p>该实例使用addEventListener()方法在按钮中添加事件</p> <button id="mybtn">点我</button> <p id="demo"></p><script type="text/javascript">document.getElementById("mybtn").addEventListener("click",displayDate);function displayDate(){document.getElementById("demo").innerHTML=Date();}</script></body></html>

点击后p标签中会出现显示事件。

阅读全文

0 0