持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第22天,点击查看活动详情
铃铛说点题外话
一句话前情回顾:两种数据类型(基本数据类型、复杂数据类型)以及typeof和instanceof判断数据类型
一句话介绍今天:事件机制
铃铛说正文
我们先看一句话:事件的触发过程是怎么样的?知道什么是事件代理吗?这绝对是一道面试比较常问的问题之一,那我们先来看看什么是事件流?
事件流
事件流是一个事件沿着特定数据结构传播的过程。冒泡和捕获是事件流在
DOM中两种不同的传播方法。也可以说事件流是冒泡到捕捉的过程
我们对事件流也详细分了三个阶段:事件捕获阶段、处于目标阶段、事件冒泡阶段
接下来我们在详细说说这三种阶段
事件捕获阶段
这个过程我们通俗点理解就是,当我们鼠标点击或者其他方式触发DOM事件的时候,浏览器会从根节点由外向内进行事件传播。也可以换一种说法就是点击子元素,如果父元素通过事件捕获的方式注册了对应的事件,会触发父元素绑定的事件。
事件冒泡阶段
事件冒泡和事件捕获恰恰相反,事件冒泡是按照从内到外的顺序进行事件传播,一直到根节点
无论是事件捕获还是使劲按冒泡,它们都有一个共同的特点也可以说是同一个行为,就是事件传播。
事件流阻止
在一些特定的情况下,我们徐娅阻止事件流的传播,阻止默认动作的发生。
事件默认阻止在不同浏览器有不同的处理方式
event.preventDefault():取消事件对象的默认动作以及继续传播。event.stopPropagation()/ event.cancelBubble = true:阻止事件冒泡。- 在
IE下使用event.returnValue= false, - 在非
IE下则使用event.preventDefault()进行阻止
跟铃铛说再见
学习的最后一步:放松
今日冷笑话:今天去相亲!女的说:我是个很传统的人!我:太好了我也是啊,不知道你对三妾这种传统怎么看?
放松结束,猜猜明天会说讲些什么吧