1.DOM事件的级别
DOM0:element.=function(){}，在html中属性上加js语句；
DOM2:element.addEventListener('click',function(){},false)， 第三个参数如果是true则表示在捕获阶段调用，为false表示在冒泡阶段调用(默认)；
DOM3:element.addEventListener('keyup',function(){},false)，事件类型增加了很多，例如：鼠标事件，键盘事件等等。2.DOM事件模型（原理）
指的就是捕获（从上到下，true），冒泡（从当前元素向上，false）。
3.DOM事件流
三个阶段，1事件捕获阶段，2目标阶段，3事件冒泡阶段。
4.DOM事件的捕获流程
捕获的具体流程：window->document->html标签->body->..父->子..->目标元素。 反之，为冒泡流程。
小补充： document.documentElement是文档对象根节点(html)的引用， document.body是DOM中document对象里的body节点。#ev{ width: 300px; height: 100px; line-height: 100px; background-color: red; color: #FFF; text-align: center; } 目标元素
5.Event对象的常见应用
1.DOM事件原理（冒泡，捕获，及流程）； 2.注册事件（监听用户的交互行为）； 3.做响应的时候Event对象非常重要。 0.event获取鼠标值（ pageX=event.clientX+document.documentElement.scrollTop||document.body.scrollTop;）图解Js event对象offsetX, clientX, pageX, screenX, layerX, x区别，键盘值（event.keyCode）。JS-事件类型（鼠标事件中event对象的独有属性） 1.event.preventDefault()，阻止默认事件，例如对a标签阻止跳转。 2.event.stopPropagation()，阻止冒泡事件，单击子元素响应事件a，单击父元素响应事件b，当单击a时阻止事件b的响应。 3.event.stopImmediatePropagation()，事件响应优先级，当一个按钮中同时绑定事件a和事件b,那么在a的响应事件中加入此句话，将会阻止事件b的执行。 4.event.currentTarget()，当前所绑定事件对象，即父元素 。（经常考察，eg:一个for循环，给一个DOM注册了n多个事件，怎么优化？）事件代理，把子元素的事件代理都转移到父元素上，在父元素上绑定一次事件就可以了，当响应的时候就要区分当前是哪个元素被点击。 5.event.target()，当前被点击的子元素，一个父元素下有十个子元素，只需要在父元素上绑定一次事件即可，需判断是哪个子元素被点击了（经常考察，与4一起）。
6.自定义事件
var eve = new Event('custome');//声明一个自定义事件，只能指定事件名
ev.addEventListener('custome',function(){
console.log('custome');
});//ev指一个DOM对象
//触发自定义事件
setTimeout(function(){
ev.dispatchEvent(eve);
},1000);
//CustomEvent，可以指定事件名，后边可以跟一个obj来做指定参数
var signin = new Event("event");//声明一个自定义事件，只能指定事件名
#ev2{
width: 300px;
height: 100px;
line-height: 100px;
background-color: red;
color: #FFF;
text-align: center;
}
Event自定义事件
var signout = new CustomEvent("CustomEvent",{
detail:{
name:"ld",sex:"female"
}
});可以指定事件名，后边可以跟一个obj来做指定参数
#ev3{
width: 300px;
height: 100px;
line-height: 100px;
background-color: red;
color: #FFF;
text-align: center;
}
CustomEvent自定义事件
var ev2 = document.getElementById("ev2");
var signin = new Event("event");
ev2.addEventListener("event",function(){
console.log("event dispatch");
});
setTimeout(function(){
ev2.dispatchEvent(signin);//此处传入的是事件对象signin，而不是事件名event
},1000);
var ev3 = document.getElementById("ev3");
var signout = new CustomEvent("CustomEvent",{
detail:{
name:"ld",sex:"female"
}
});
ev3.addEventListener("CustomEvent",function(e){
console.log("CustomEvent dispatch");
console.log(e);
console.log(e.detail.name);
});
setTimeout(function(){
ev3.dispatchEvent(signout);
},1000);
//输出结果
//event dispatch
//CustomEvent dispatch
//CustomEvent {isTrusted: false, detail: {…}, type: "CustomEvent", target: div#ev3, currentTarget: div#ev3, …}bubbles: falsecancelBubble: falsecancelable: falsecomposed: falsecurrentTarget: nulldefaultPrevented: falsedetail: {name: "ld", sex: "female"}eventPhase: 0isTrusted: falsepath: (5) [div#ev3, body, html, document, Window]returnValue: truesrcElement: div#ev3target: div#ev3timeStamp: 37.19999999884749type: "CustomEvent"__proto__: CustomEvent
//ld 
