事件冒泡和事件捕获有什么区别？

最新推荐文章于 2024-05-29 16:43:17 发布
最新推荐文章于 2024-05-29 16:43:17 发布
阅读量1.7k 收藏 5
点赞数 1
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_62614119/article/details/123075726
版权

1.事件冒泡从下至上。当给父子元素的同一事件绑定方法的时候（比如click点击事件），触发子元素身上的事件，执行完毕之后，也会触发父级元素相同的事件。

2. 事件捕获：从上至下到指定元素。当出发子元素身上到事件的时候，先触发父元素，然后再传递给子元素。

addEventListener中有三个属性，第三个属性是布尔值。false为事件冒泡，true 为事件捕获

&&&&&&&&&&&&
关注
  • 1
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
事件冒泡和事件捕获的区别
从人到猿
07-01 1233
事件冒泡和事件捕获的区别： 1、从事件流向的角度说： 事件冒泡：当触发了某个元素的某类型(如：onclick)的事件后，该元素的父元素的同类型（如：onclick）的事件也会被触发，依次类推最终会触发到最根的元素 网上会有这样的说法：从具体的元素（事件源）到不具体（不确定的元素）。 事件捕获： 与事件冒泡相反，从根元素朝事件源进行触发的。 网上会有这样的说法：从不具体的元素到确定的元素（事件源）。...
冒泡与捕获
WYF857446152的博客
05-25 5420
冒泡事件与捕获事件，以及阻止冒泡事件 阻止默认
js中事件的捕获和冒泡的区别
最新发布
ivan5277的博客
05-29 461
方向差异：事件冒泡是从事件发生的目标元素向外传播到不具体的节点，而事件捕获则是从不具体的节点向内传播到目标元素。处理时机：事件捕获发生在事件到达目标元素之前，而事件冒泡则在此之后。实际应用：根据需要选择合适的事件传播机制，通常事件冒泡更常用，但特定场景下事件捕获提供了一种更精细的控制手段。在实际开发中，开发者可以根据需求选择或结合使用这两种机制，以实现对事件的精确控制。
事件捕获方式和冒泡方式—它们的区别是什么?
橙子的博客
06-13 409
😄看一个document代码段： 你看我点一下里面的div，它就会一个冒泡事件，但是这个冒泡事件我们是看不到的，但是它是按这个顺序发生的：从最里面依次沿着上层触发，再看一下模型图： 事件捕获:事件捕获实际上是为了在事件到达最终目标 前拦截事件，顾名思义就是捕获某个东西。😄看这个document代码段： 同样的图，但是它们的触发顺序却不同，如下：可以看出它是从最外面开始触发的，直到捕获到你点击的div为止，模型图如下： 事件冒泡：一个由里到外，冒泡，向上层延申。事件捕获：一个由外到里，前往捕获，形成向下趋..
解释下事件冒泡和事件捕获的区别
有我更精彩的博客
03-14 1078
在前端开发中，事件冒泡和事件捕获是两种JavaScript事件传播机制。了解这两种机制对于理解前端开发中的事件处理非常重要。
深入理解JavaScript的事件冒泡与事件捕获
金鳞踏雨
03-09 4739
JavaScript中提供了很多操作DOM的API。事件冒泡和事件捕获是指浏览器中处理DOM元素上事件的两种不同方式。事件冒泡和事件捕获都是JavaScript事件模型中的一部分，可以用来处理事件。对于这个问题，在实际开发中，并不是非常重要，因为在工作中我们基本上不会直接操作DOM，为了高效一般都是通过Vue、React这些框架，所以关于事件处理程序的一些坑直接就被避免了！！！但是，多了解一点是没有坏处的，毕竟面试会考~
事件冒泡和事件捕获的区别：
boysky0015的博客
06-14 1649
事件流描述的是从页面接收事件的顺序。 IE的事件是冒泡事件流， 而firefox的事件流是捕获事件流。 1.事件冒泡 IE的事件流叫做事件冒泡，即事件从最具体的元素到不具体的元素。 好比气泡从水底下一直向上冒泡，像dom树一样，一直到根元素。 2.事件捕获 即从不具体的元素到具体的元素。
事件冒泡和事件捕获区别及设置
SpringRolls的博客
03-01 1666
事件冒泡：从下至上(是指子元素向父元素传递的过程)， bool=false冒泡(默认) 事件捕获：从上至下(是指父元素向子元素传递的过程)， bool=true 捕获 一般不会用到 事件委托利用冒泡阶段运行的机制实现的， 使用事件代理的方法少了遍历所有li节点的操作，性能上肯定更加优化，而且如果后期又动态的增加li节点，不使用事件代理的话还需要再重新给新增的li节点绑定事件，但是使用事件代理的话则不需要了。 例子：假设一个元素div，它有一个下级元素p。 <div> 　　<p.
简述事件捕获和事件冒泡的区别
热门推荐
zj950307的博客
06-04 1万+
这个在面试中是一个问的比较多的问题，有时候也会在笔试的简答题中碰到。首先我们要知道：一个完整的js事件流是从window开始，最后回到window的过程，如下图所示：1-5是捕获过程，5-6是目标阶段，6-10是冒泡阶段；以一段具体的代码来看：&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset...
JS中事件冒泡和事件捕获介绍
11-27
谈起JavaScript的 事件，事件冒泡、事件捕获、阻止默认事件这三个话题，无论是面试还是在平时的工作中，都很难避免。 事件捕获阶段：事件从最上一级标签开始往下查找，直到捕获到事件目标(target)。 事件冒泡阶段：事件从事件目标(target)开始，往上冒泡直到页面的最上一级标签。 1、冒泡事件： 事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发。通俗来讲就是，就是当设定了多个div的嵌套时；即建立了父子关系，当父div与子div共同加入了onclick事件时，当触发了子div的onclick事件后，子div进行相应的js操作，但是父div的onclic
事件冒泡与事件捕获
01-20
简单说说 事件冒泡原理 从下至上 从最里面元素事件冒泡到最外层父级元素上 大哥 二哥 三弟 var a = document.getElementsByClassName('a')[0] var b = document.getElementsByClassName('b')[0] var c = document.getElementsByClassName('c')[0] a.addEventListener(click, function (event) { console.log(大哥);
理解事件捕获和事件冒泡
Hey firefly
04-03 6230
参考资料浅谈事件冒泡与事件捕获 一年前刚开始接触JavaScript的时候就看过有关事件冒泡和事件捕获的文章，但是当时只是看过了就是看过了，没有自己实际的实践，并没有什么自己的理解在里面，属于转眼就忘的那种状态，这段时间由于参加百度的ife前端培训，做到js方面的任务时，决定仔细的学习一下时间捕获和事件冒泡，所以就有了今天这篇文章。 ps：其实前两天就想写了，但无奈图书馆的网一直连不上，只好推到
事件冒泡和事件捕获的含义？ — 第13.1讲
flyingpig2016的博客
10-29 4063
该懂得一定要懂，该学的不能再拖，该行动的就是此刻！ 一：事件流的历史？  就像是在桌面上画了许多同心圆，当把手放在圆心上，那么你的手指指的不是一个圆，而是所有的圆。公司的浏览器开发团队在看待浏览器事件方面还是一致的，如果你单击了某个按钮，他们都认为，事件不仅仅发生在按钮上，甚至单击了整个页面。    JavaScript中事件流描述的是从页面中接收事件的顺序，但是有意思的是，IE和Netscape
事件冒泡和事件捕获
weixin_39205240的博客
05-24 250
        今天在写一个项目中遇到了一个问题，用js控制一个div的显示和隐藏。本来想着挺简单的，结果就遇到了让我比较郁闷的事情了。不管我怎么改就是没有效果。绞尽脑汁的查找，终于在快下班的时候找到了问题所在。我的HTML是这样子的：&lt;li class="skin-series"&gt;类型 &lt;ul class="skin-choose-box"&gt; &l...
事件冒泡与事件捕获详解
星河梦~的博客
07-21 4864
事件流 概念 首先，我们来了解一下什么是事件流。 事件流：当事件发生时，会在发生事件的元素节点与DOM树根节点之间按照特定的顺序进行传播， 这个过程称之为事件流。 （当页面触发一个事件时，会按照一定的顺序来响应事件，事件的响应过程称为事件流。） 分类 事件流可分为冒泡型事件流、捕获型事件流。 （1）事件冒泡：微软公司提出的，事件由子元素传递到父元素的过程叫做冒泡（false）。 查找事件（事件响应）的顺序：文本节点–>元素节点—>body—>html—>document（例如点击事件
JQuery 之 事件委托(事件代理)
Nick.Peng's Blogs
09-20 2205
事件委托/事件代理： 事件委托就是利用冒泡的原理，把事件加到父级上，通过判断事件来源的子集，执行相应的操​ 事件委托的写法： $(选择器).delegate( 事件真实发生在谁身上, 事件属性，匿名函数写命令) 事件委托的好处： 可极大减少事件绑定次数，提高性能 可让动态加入的子元素绑定相同的命令 Example： <!--js部分--> <script>...
什么是事件冒泡和事件捕获？
03-31
事件冒泡和事件捕获是JavaScript中处理事件的两种机制。 事件冒泡：当一个元素触发了某个事件时，该事件会从这个元素开始向外层元素逐层传递，直到传递到最外层元素。例如，当点击一个按钮时，按钮的点击事件会先被触发，然后冒泡到其父元素，再到其父元素的父元素，一直到文档的根元素。 事件捕获：与事件冒泡相反，事件捕获是从文档根元素开始，逐层向内部元素传递，直到传递到触发事件的元素。例如，当点击一个按钮时，事件会从文档根元素开始向下传递，一直到按钮，然后才会触发按钮的点击事件。 在实际应用中，事件冒泡和事件捕获可以结合使用，以达到更好的事件处理效果。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值