前言JavaScript中提供了很多操作DOM的API。事件冒泡和事件捕获是指浏览器中处理DOM元素上事件的两种不同方式。事件冒泡和事件捕获都是JavaScript事件模型中的一部分，可以用来处理事件。对于这个问题，在实际开发中，并不是非常重要，因为在工作中我们基本上不会直接操作DOM，为了高效一般都是通过Vue、React这些框架，所以关于事件处理程序的一些坑直接就被避免了！！！但是，多了解一点
转载
2023-11-19 13:15:37
50阅读
# jQuery中的事件冒泡与捕获：阻止事件的处理
在JavaScript和jQuery的世界中，事件处理是一个重要的概念。我们常常会遇到“事件冒泡”和“事件捕获”这两个术语。本文将为您详细解析这两个概念，并同时介绍如何使用jQuery阻止事件的冒泡和捕获。
## 什么是事件冒泡和捕获？
### 事件冒泡
事件冒泡是指当事件被触发时，它从事件目标（最具体的元素）开始，逐级向上传播到其父元素
# jQuery事件捕获和事件冒泡的联系
在前端开发中，事件捕获和事件冒泡是两个重要的概念，它们涉及到HTML元素之间的事件处理。当我们使用jQuery来处理事件时，理解这两个概念非常重要。本篇文章，我将通过几个步骤来帮助你理解事件捕获和事件冒泡之间的联系。
## 事件捕获与事件冒泡的流程
首先，让我们先概述一下事件捕获与事件冒泡的流程。我们可以使用下面的表格来展示这个过程：
| 步骤
防止事件冒泡 首先我们要知道的前提是当任何的元素发生事件时，事件处理机制首先会检查该元素是否附加了事件方法（以及事件处理函数）。如果是，就执行（附加的事件方法的）事件处理函数的语句。在此之后，事件处理机制继续检查该元素的亲节点，看是否附加了事件方法，如果是，也会执行事件处理函数。继续检查其亲元素（即亲元素的亲元素），如此类推，换句话说，事件冒泡指的是被触发事件在DOM中向
转载
2023-09-27 21:35:53
136阅读
事件; 事件是文档和浏览器窗口中发生的特定的交互瞬间。 事件是javascript应用跳动的心脏，也是把所有东西黏在一起的胶水，当我们与浏览器中web页面进行某些类型的交互时，事件就发生了。 事件可能是用户在某些内容上的点击，鼠标经过某个特定元素或按下键盘上的某些按键，事件还可能是web浏览器中发生的事情，比如说某个web页面加载完成，或者是用户滚动窗口或改变窗
js中冒泡事件和捕获事件：冒泡事件：冒泡事件是从里向外，即是从被绑定元素开始一直向外到达页面的所有祖先元素都会被触发，这 一过程被称为事件冒泡。这个事件从原始元素开始一直冒泡到DOM树的最上层捕获事件：捕获事件是从页面的最上层到被绑定元素都会触发。IE只支持事件冒泡，不支持事件捕获冒泡事件和捕获事件的方向是相反的。形式如下图所示： 一般为浏览器中的元素绑定事件有2种方式：一、直接在页面元
转载
2023-12-31 20:38:40
70阅读
今天把事件捕获和事件冒泡彻底搞懂了。来记录一下。 当你监听一个事件的触发的时候，它会经历三个状态，第一个是捕获阶段，第二个是目标节点，第三个是冒泡阶段，画个图来表示一下。 当我们触发某个DOM的监听事件的时候，捕获阶段会从外向内找到这个DOM节点，一般会在冒泡阶段执行监听事件。也就是说，当我们有如下 ...
转载
2021-10-10 12:31:00
256阅读
2评论
1事件传播——冒泡与捕获 默认情况下，事件使用冒泡事件流，不使用捕获事件流。然而，在Firefox和Safari里，你可以显式的指定使用捕获事件流，方法是在注册事件时传入useCapture参数，将这个参数设为true。2冒泡事件流 当事件在某一DOM元素被触发时，例如用户在客户名字节点上点击鼠标，事件将跟随着该节点继承自的各个父节点冒泡穿过整个的DOM节点层次，直到它遇到依附有该事件类型处理
转载
2023-12-31 17:05:11
48阅读
事件冒泡（Event Bubbling）、事件捕获（Event Capturing）和
原创
2023-08-07 09:03:19
137阅读
事件冒泡和事件捕获这两个概念都是为了解决页面中事件流（事件发生顺序）的问题。 1、事件冒泡 事件冒泡：事件会从最内层的元素开始发生，一直向上传播，直到document对象。 2、事件捕获 事件捕获：与事件冒泡相反，事件会从最外层开始发生，直到最具体的元素。 3、addEventListener方法e
原创
2022-09-17 03:16:24
373阅读
先上结论：他们是描述事件触发时序问题的术语。事件捕获指的是从document到触发事件的那个节点，即自上而下的去触发事件。相反的，事件冒泡是自下而上的去触发事件。绑定事件方法的第三个参数，就是控制事件触发顺序是否为事件捕获。true,事件捕获；false,事件冒泡。默认false,即事件冒泡。Jquery的e.stopPropagation会阻止冒泡，意思就是到我为止，我的爹和祖宗的事件就不要触发
原创
2017-03-05 03:18:50
454阅读
上篇笔记提到了
事件的修饰符，其中不少是与
事件冒泡相关
的，于是这篇来大致总结一下。 ·
事件冒泡 当一个元素接收到
事件时，会把“接收
事件”这个行为传递给自己
的父级，比如在<p>上发生
事件，那么顺序为：p -> div -> body -> html -> document （
冒泡过程） 这里要注意
的是 ...
转载
2021-10-11 17:54:00
134阅读
2评论
阅读目录总结事件冒泡和事件捕获HTML结构需求：鼠标放到 li上对应的 li 背景变灰源码总结它是描述事件触发时序问题的术语。事件捕获指的是从 document 到触发事件的那个节点，即自上而下的去触发事件。相反的，事件冒泡是自下而上的去触发事件。绑定事件方法的第三个参数，就是控制事件触发顺序是否为事件捕获。true,事件捕获；false,事件冒泡。默认false,即事件冒泡。1、事件冒泡是什么？先 child，然后 parent。事件的触发顺序自内向外，这就是事件冒泡。2、事件捕获是
原创
2023-02-09 10:49:32
80阅读
事件冒泡：有同一父元素 点击子元素 由内向外触发 事件捕获：有同一父元素，点击子元素，由外向内触发 使用场景：ul下的li 给ul绑定事件对li进行触发
原创
2022-07-13 11:15:56
78阅读
事件捕获当你使用事件捕获时，父级元素先触发，子级元素后触发，即div先触发，p后触发。事件冒泡当你使用事件冒泡时，子级元素先触发，父级元素后触发，即p先触发，div后触发。W3C模型W3C模型是将两者进行中和，在W3C模型中，任何事件发生时，先从顶层开始进行事件捕获，直到事件触发到达了事件源元素。然
转载
2016-12-01 17:59:00
281阅读
2评论
件冒泡和事件捕获的demo了无标题文档 事件的eventPhase说明了事件执
原创
2023-01-13 15:57:17
148阅读
事件捕获：Outer -> inner, 事件冒泡：Inner -> Outer;一个事件的的发生，先后经历事件捕获、事件冒泡两个阶段，形成一个闭合的事件传递链，即document -> ..->target DOM -> ... -> document(有些浏览器(如Firefox)可能是起点和终点window)；事件捕获：即事件
转载
精选
2015-04-23 10:19:55
633阅读
今天看到阿里的一道面试题：如果给一个元素绑定了4个事件处理（用addEventListener），其中两个是capture, 两个冒泡，那么触发顺序是什么？看完之后开始找答案，然后写个栗子测试了一下： <!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<
无标题文档 点击div3时，进来的点击事件（事件捕获）从1到3，出去的点击事件（事件冒泡）从3到1.每个div经历2个点击事件。 无标题文档
转载
2016-08-01 13:43:00
319阅读
2评论
事件捕获阶段：事件从最上一级标签开始往下查找，直到捕获到事件目标(target)。 事件冒泡阶段：事件从事件目标(target)开始，往上冒泡直到页面的最上一级标签。 点击蓝色（父元素） 点击红色 （子元素）（先捕获，再冒泡） 事件冒泡 https://www.cnblogs.com/moqing/ ...
转载
2021-09-09 14:48:00
261阅读
2评论
