addEventListener事件方法
一、事件函数调用语法：
element.addEventListener(event, function, useCapture)
| 参数 | 描述 |
| event |
必须。字符串，指定事件名。 注意: 不要使用 "on" 前缀。 例如，使用 "click" ,而不是使用 "onclick"。 |
| function | 必须。指定要事件触发时执行的函数。
当事件对象会作为第一个参数传入函数。 事件对象的类型取决于特定的事件。例如， "click" 事件属于 MouseEvent(鼠标事件) 对象。 |
| useCapture | 可选。布尔值，指定事件是否在捕获或冒泡阶段执行。
可能值:
|
二、事件触发方式（event）：
| click | 鼠标左键单击 |
| mouseover | 鼠标移动到上面 |
| mouseout | 鼠标离开 |
| mousemove | 鼠标移动 |
三、兼容性：
如果浏览器不支持 addEventListener() 方法, 你可以使用 attachEvent() 方法替代。
以下实例演示了跨浏览器的解决方法：
var x = document.getElementById("myBtn");
if (x.addEventListener) { //所有主流浏览器，除了 IE 8 及更早 IE版本
x.addEventListener("click", myFunction);
} else if (x.attachEvent) { // IE 8 及更早 IE 版本
x.attachEvent("onclick", myFunction);
}
四、移除事件语法：
removeEventListener(event,function);
五、实例：
注册事件、移除事件
<button id="myBtn">点我</button>
<p id="demo">
<script>
document.getElementById("myBtn").addEventListener("click", myFunction);//注册事件
function myFunction()
{
document.getElementById("demo").innerHTML = "Hello World";
}document.getElementById("myBtn").removeEventListener("click", myFunction);//移除事件
</script>
时间： 2024-08-10 17:14:01