DOM事件

一、事件级别

DOM0

element.onClick = function(){}

DOM2

element.addEventLisenter('click', function(){}, false);

DOM3    增加了多种事件类型

element.addEventListener('keyup', function(){}, flase);

二、事件模型

捕获    自上而下

冒泡    自下而上

三、事件流

事件捕获阶段(capture phase)

处于目标阶段(target phase)

事件冒泡阶段(bubbling phase)

四、事件捕获具体流程

window → document → html → body → parent → child → target

五、Event对象常见应用

event.preventDefault();    //阻止默认事件

event.stopPropagation();    //阻止冒泡

event.stopImmediatePropagation();    //事件响应优先级

event.currentTarget;   //当前绑定事件的元素，一般在事件委托时事件绑定在父元素

event.target;    //当前被点击的元素

六、自定义事件

var event = new Event('custome');

element.addEventListener('customer', function(){

    console.log('custome');

});

element.dispatchEvent(event);