JS事件流机制

1.事件冒泡的概念:事件按照从最特定事件目标到最不特定事件目标的顺序触发。通俗来讲就是,就是当设定了多个div嵌套的时;即建立了父子关系,当父div与子div共同加入了onclick事件时,当触发了子div的onclick事件后,子div进行相应的js操作,但是父div的onclick事件同样会被触发。阻止事件冒泡的操作有,给事件冒泡的原对象绑定事件为e.cancelBubble=true,阻止事件继续传播用的函数是e.stopPropagation,e.preventDefault取消该事件而不停止事件的进一步传播。
2.事件捕获的概念:从顶层目标元素或者从目标元素到顶层元素,和事件冒泡是一个相反的过程。事件从最不精确的对象开始触发,然后到最精确。
3.一般来说事件冒泡机制用的更多一些,所以在IE8以及之前,IE只支持事件冒泡。IE9+开始两种模型都支持,可以通过addEventListener的userCapture来设定,useCapture=false代表着事件冒泡。useCapture=true代表着事件捕获。
4.DOM事件流指的是把事件分为三个阶段:捕获阶段、目标阶段、冒泡阶段。先调用捕获阶段的处理函数,其次调用目标阶段的处理函数,最后调用冒泡阶段的处理函数。捕获阶段的事件处理函数,一定比冒泡阶段的事件处理函数先执行。但是最内层元素不区分先捕获还是先冒泡,谁先谁执行。
5.像这种把onclick写在标签内的都是DOM0级事件,fn和fn1依次执行。DOM0级事件会存在事件覆盖,同时也会覆盖行内的元素。DOM2级事件会依次执行绑定的方法,不会进行一个覆盖。DOM0级事件只支持冒泡而不支持捕获,但DOM2级事件既支持捕获也支持冒泡。
6.什么是事件委托:基于js的事件冒泡机制,可以以JS事件委托的方式,在父元素上给父元素的子元素绑定事件,同时减少事件绑定的时间复杂度。
    事件委托的优点:1:提高性能,每个函数都会占用内存空间,只需要添加一个事件处理程序代理所有事件,所占用的内存空间更少。
                                  2.动态监听:使用事件委托可以自动绑定动态增加的元素,即新增的节点不需要主动添加也可以一样具有和其他元素一样的事件。
https://blog.csdn.net/runner_123/article/details/80350259

全部评论

相关推荐

12-14 11:43
黑龙江大学 Java
用微笑面对困难:确实比较烂,可以这么修改:加上大学的qs排名,然后大学简介要写一些,然后硕士大学加大加粗,科研经历第一句话都写上在复旦大学时,主要负责xxxx,简历左上角把学校logo写上,建议用复旦大学的简历模板
点赞 评论 收藏
分享
不愿透露姓名的神秘牛友
11-21 11:29
已编辑
斯卡蒂味的鱼汤:知道你不会来数马,就不捞你😂最近数马疯狂扩招,招聘要求挺低的,你能力肯定够,应该就是因为太强了,知道你不会来才不捞你
投递腾讯云智研发等公司7个岗位
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务