当一个事件发生的时候，都会去创建一个对象，我们可以从事件对象上获取一些相关的信息。比如，事件是通过什么触发的，是鼠标呀，还是键盘呀，事件触发的时候是否有冒泡、是否有阻止等很多的相关信息。
在js编程中有一句话，一切介对象，所以事件也是对象。比如，当我们点击一个函数的时候，会触发一个函数，这个函数就开始执行了。这个函数就是方法，而方法就是对象。
EventTarget对象 定义了事件监听与触发方法的对象
我们在前面讲过，一个节点有继承的关系，没个节点都会有一个头，而EventTarget就是这个继承的头。
1、所有节点都继承这个对象；
2、这个对象上有三个方法；
2.1、addEventListener 绑定事件的监听函数
参数2可以是一个对象（必需具有handleEvent方法）
参数3可以是一个对象
capture false代表冒泡阶段触发，true代表捕获阶段触发
once false代表事件可以触发多次，true代表事件只能触发一次
passive false代表事件里可以使用preventDefault方法，true代表事件里不可以使用preventDefault方法（会报错）
<div>1</div>
<div>2</div>
<div>3</div>
<script>
console.dir(EventTarget);
console.dir(Event);
const divs=document.querySelectorAll("div");
divs[0].addEventListener('click',{
handleEvent(ev){
console.log(ev);
ev.preventDefault();
}
},{capture:false,once:true,passive:false});
divs[1].addEventListener('click',function(){
console.log(this);
});
divs[1].addEventListener('click',function(){
console.log(this);
});
const obj={
age:18,
handleEvent(ev){
console.log(this); //这里的this会指向obj对象本身
console.log(this.age); //这里的this会指向obj对象本身
}
};
divs[1].addEventListener('click',obj);
//移除事件处理函数
obj.handleEvent=()=>{
console.log('事件函数已经被修改');
}
const events={
handleEvent(ev){
switch(ev.type){
case 'click':
this.click(ev);
break;
case 'mousemove':
this.mousemove(ev);
break;
case 'mouseout':
this.mouseout(ev);
break;
}
},
click(ev){
console.log('鼠标被点击了');
},
mousemove(ev){
console.log('鼠标移动了');
},
mouseout(ev){
console.log('鼠标离开了');
}
};
divs[2].addEventListener('click',events);
divs[2].addEventListener('mousemove',events);
divs[2].addEventListener('mouseout',events);
</script>
从上面的代码我们可以看出，以后我们只需要操作 obj.handleEvent就可以了
2.2、removeEventListener 移除事件的监听函数
2.3、dispatchEvent 触发事件
事件发生以后，会生成一个事件对象Event
Event 事件对象（事件的构造函数）
1、它里面存储了事件发生时的各种信息；
2、标准浏览器的事件对象为事件监听函数的第一个参数；
3、它包含很多子类MouseEvent、KeyboardEvent、InputEvent、FocusEvent、WheelEvent、UIEvent；
属性
1、bubbles 表示当前事件是否会冒泡，返回布尔值
2、cancelBubble 与上一个一样，但是它可以设置，已从web标准里移除了用stopPropagation()方法来代替
3、cancelable 表示这个事件的默认动作是否可以取消，返回布尔值。如果为true的话可以调用它对应的preventDefault()方法，为false的话不可以（IE不支持）
4、currentTarget 返回绑定事件的节点
5、target 返回触发事件的节点（点击的是哪个节点这个值就指向这个节点）（IE678里这个属性名为srcElement）
6、defaultPrevented 表示事件是否已经阻止默认行为（调用过preventDefault方法），返回布尔值
7、eventPhase 表示事件目前所处的阶段，返回数字
0 事件目前没有发生
1 事件目前处于捕获阶段
2 事件到达目标节点
3 事件处于冒泡阶段
8、type 表示事件类型，返回一个字符串
9、isTrusted 表示该事件是否为真实用户触发，返回布尔值（用模拟事件触发返回false）
方法
1、preventDefault 取消浏览器对当前事件的默认行为；
2、stopImmediatePropagation 阻止同一个事件的其他监听函数被调用；
3、stopPropagation 阻止事件在DOM中继续传递；
