DOM事件类

2020-06-13  本文已影响0人  SkyBlue丶ly

一,DOM事件的级别

    1,DOM0:element.onclick=function(){}

    2,DOM2:element.addEventListener('click',function(){},false)

    3,DOM3:element.addEventListener('keyup',function(){},false),增加了事件类型

二,DOM事件模型

    1,事件捕获(从上往下)

    2,事件冒泡(当前元素往上)

三,DOM事件流

    1,捕获阶段

    2,目标阶段

    3,冒泡过程

四,描述DOM事件捕获的过程

    1,window

    2,document

    3,html

        1)js获取方式:document.documentElement

    4,body

    5,一层一层元素

    6,目标元素

五,Event对象的常见应用

    1,event.preventDafault():阻止默认事件

    2,event.stopPropagation():阻止冒泡行为

    3,event.stopImmediatePropagation():如果同一个元素,绑定多个事件,只要在某个一个事件中写该方法,就不会执行其他事件(方法阻止监听同一事件的其他事件监听器被调用)

    4,event.currentTarget:标识是当事件沿着 DOM 触发时事件的当前目标。它总是指向事件绑定的元素

    5,event.target:事件触发的元素

六,自定义事件

    1,示例:var eve = new Event("custome");ev.addEventListener("custome",function(){});ev.dispatchEvent(eve);ev是元素

    2,CustomeEvent,类似Event,不同的是CustomeEvent,可以传事件名称和Object参数,Event只能传事件名称

上一篇下一篇

猜你喜欢

热点阅读