DOM事件总结

注册事件（绑定事件）

1.传统绑定：onclick

2.事件监听：addEventListener('click'，function(){}) ， IE9以上的支持

(1)事件类型是字符串，不加on

(2)同一个元素 同一个时间可以添加多个侦听器（事件处理程序）

删除事件（解绑事件）

1.传统事件删除事件：eventTarget.onclick =null;

2.removeEventListener('click',function)

3.detachEvent('onclick',function)

DOM事件流

分为：事件捕获阶段，事件目标阶段，事件冒泡阶段

1.js代码只能执行捕获或者冒泡事件

2.onclick和attachEvent(ie) 只能得到冒泡阶段

3.捕获阶段 如果addEventListener第三个参数为true为捕获阶段，否则为冒泡阶段,一般更关注事件冒泡

addEventListener（'click',function(){},true）//捕获阶段

4.有些事件没有冒泡阶段，比如：onblur\onfocus\onmouseenter\onmouseleave

事件对象

1.event就是事件对象，当形参来看；

2.事件对象只有有了事件才会存在，它是系统自动创建得，不需要我们传递参数；

3.事件对象是事件得一系列香瓜数据得集合,有很多相关的属性和方法；

4.这个事件对象我们自己可以命名，比如：e,event；

5.事件对象也有兼容性问题ie678通过window.event兼容性得写法：e=e||window.event

div.onclick =function(event){}

div.addEventListener('click',function(event){},true)

事件对象常见的事件和方法

阻止事件冒泡方法： e.stopPropagation() 和window.e.cancelBubble =true(低版本浏览器);

事件委托（代理、委派)

原理：不是每个子节点单独设置事件监听器，而是事件监听器设置在父节点上，利用事件冒泡影响每一个子节点。

禁止鼠标右击事件：contextmenu

document.addEventListener('contextmenu',function(e){ 
   e.preventDefault(); 
})

禁止鼠标选中事件：selectstart开始选中

document.addEventListener('selectstart',function(e){
   e.preventDefault();
 })