DOM事件

DOM事件模型

DOM 事件模型就是冒泡和捕获

描述DOM事件捕获的具体流程

window----document-----html----body....  ----目标元素

DOM事件流

DOM事件流就是描述DOM事件捕获的具体流程

事件流被分为三个阶段：1 捕获过程 2 目标过程 3 冒泡过程

Event对象的常见应用

DOM事件类

DOM0   element.onclick = function() {}

DOm2   element.addEventListener("click",function(){},false)

DOm3    element.addEventListener('keyup',function(){},false)

Event对象的常见应用

event.preventDefault()  //阻止默认行为
event.stopPropagation()  //阻止冒泡事件
event.stopImmediatePropagation()//阻止剩余的事件处理函数的执行，并防止当前事件在DOM树上冒泡。
event.currentTarget(当前绑定事件的对象，指定的是父级元素)
event.target（target是当前被点击的元素）
target 是真正发生事件的DOM元素，而currentTarget是当前事件发生在哪个DOM元素上

事件委托

1 什么是事件委托？
   事件委托就是利用事件冒泡，指定一个事件处理程序，就可以管理某一类型的所有的事件。

自定义事件（不管是面试还是做开发都是很重要的一个点）–或者模拟事件

//通过new Event声明一个自定义事件，把event这个事件当做普通事件对象，只不过这个事情是你定义的
var  eve = new  Event('custome');


//ev是一个dom节点，通过dom2这种事情注册的方法绑定这个事件名称
ev.addEventListener('custome',function () {
       console.log('custome');
})


//最后触发就是用这个dom节点，dispatchEvent这个api触发eve这个对象
ev.dispatchEvent(eve);
 1  Event 的不足只能指定事件名，如果想给这个事件加些数据，Event是做不到的；用CustomEvent；

2  CustomeEvent 自定义事件的一个方法；除了可以指定事件名，后边还可以跟一个object来做指定参数。这个参数是自定义的，所以用法是一样的