JS 事件触发后的三个阶段

最新推荐文章于 2024-03-11 21:23:53 发布
最新推荐文章于 2024-03-11 21:23:53 发布
阅读量714 收藏 1
点赞数
分类专栏： JS 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_46275230/article/details/124387516
版权

JS 事件触发后的三个阶段

文章目录

1.事件捕获阶段

事件由最不精确的目标对象(document)开始触发，一直触发到具体精确的目标元素对象（element）的过程

2.目标阶段

目标阶段的事件会触发该元素（即事件目标）上的所有监听器

3.事件冒泡阶段

事件由精确，特定的目标元素对象（element）开始触发,一致触发到最不精确的目标对象（docuemnt）的过程

过程图形说明

请添加图片描述

OGoodness
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JS事件的三个阶段详解
RoddyLD的博客
05-30 2388
JS事件的三个阶段详解一、JS事件的三个阶段二、冒泡阶段触发事件三、捕获阶段触发事件四、阻止冒泡行为五、阻止事件冒泡和默认行为 一、JS事件的三个阶段 事件处理机制的三个阶段：1.捕获 2.目标 3.冒泡 element.addEventListener(event, function, useCapture) useCapture:事件处理机制（捕获阶段true，目标阶段，冒泡阶段false）默认为冒泡阶段 捕获阶段：事件从外向内执行; 冒泡阶段：事件从内向外执行 当点击目标元素的时候就是这三步，唯一
js事件流三个阶段
xiaoxiaofly的博客
07-25 4361
事件的处理过程主要有三个阶段：捕获阶段，目标阶段，冒泡阶段； 捕获阶段：当我们在 DOM 树的某个节点发生了一些操作（例如单击、鼠标移动上去），就会有一个事件发射过去。这个事件从 Window 发出，不断经过下级节点直到触发的目标节点。在到达目标节点之前的过程，就是捕获阶段（Capture Phase）。事件由页面元素接收，逐级向下，到具体的元素。 目标阶段：当事件不断的传递直到目标节点的时候...
事件流及其三阶段
alightman的博客
09-24 4609
事件流 1.事件的捕获阶段 2.事件的目标阶段 3.事件的冒泡阶段 事件有三个阶段，首先发生的是捕获阶段，然后是目标阶段，最后才是冒泡阶段，对于捕获和冒泡，我们只能干预其中的一个，通常来说，我们可能会干预事件冒泡阶段，而不去干预事件捕获阶段。 1、事件捕获 事件捕获是火狐浏览器提出来的，IE678不支持事件捕获（基本上，我们都是用事件冒泡）事件的处理将从DOM层次的根开始，
js事件流的三个阶段
weixin_33763244的博客
03-15 1356
2019独角兽企业重金招聘Python工程师标准>>> ...
面试考点解析：JavaScript 事件流深度剖析
最新发布
m0_64728371的博客
03-11 1024
JavaScript 事件流是指在 HTML 文档中，事件的传播过程，即事件从触发元素向上或向下传递的路径。事件捕获阶段（Capturing phase）：在这个阶段中，事件从最外层的元素开始向内部元素进行传播，直到达到触发事件的具体目标元素。目标阶段（Target phase）：当事件传播到达目标元素时，就进入了目标阶段。在这个阶段，事件达到了目标元素并在目标元素上触发相应的事件处理程序。事件冒泡阶段（Bubbling phase）
JavaScript事件处理的方式(三种)
11-25
这两种模式在早期浏览器实现中有所不同，但现在大多数浏览器支持两种模式，可以通过addEventListener方法的第三个参数来选择事件处理模式。 JavaScript事件处理程序有三种常见的添加方式： 1. HTML事件处理程序：...
javascript下对于事件、事件流、事件触发的顺序随便说说
10-29
`addEventListener`方法是DOM中用于添加事件监听器的标准方法，接受三个参数：事件类型、处理函数和布尔值，该布尔值决定事件是捕获还是冒泡阶段触发。当第三个参数为`true`时，事件将在捕获阶段处理；为`false`，则...
js触发事件大全
11-21
JavaScript触发事件是网页交互设计的核心组成部分，它们允许开发者在用户与网页进行互动时执行特定的代码块。以下是对“js触发事件大全”中所提及的关键事件的深入解析，旨在为前端开发者提供全面的理解。 ### 一、...
window.addEventListener来解决让一个js事件执行多个函数
10-27
第三个参数`useCapture`在此处通常设为`false`，表示在冒泡阶段调用事件处理函数。 此外，对于DOM元素的事件处理，如按钮点击事件，也可以使用相同的方法。例如，对于一个ID为"btn1"的按钮，我们希望在点击时执行`...
通俗易懂地理清js事件流中的捕获阶段，目标阶段和冒泡阶段的具体运行顺序
01-08
众所周知，事件流分为三个阶段冒泡分为捕获阶段，目标阶段和冒泡阶段， 这三个阶段到底是如何运行的呢？如果给同一个事件绑定上冒泡和捕获的事件到底会怎样触发呢？ 下面我用dom2级事件函数来变换捕获和冒泡，用...
JavaScript之事件操作
dyjffgkvfg的博客
11-12 2091
特点：经过 后代标签边界线时 同时触发 移入移出两个事件 触发执行的顺序是 先移出 再移入。在 事件源 范围内移动 会触发事件,鼠标移动才能触发事件 鼠标只是悬停 不能触发事件。产生原因：事件源与父级标签绑定了相同的事，当事件源执行时，父标签也会触发相同的事件操作。1.不是所有的标签都能直接绑定键盘事件，只有可以获取焦点的标签支持直接绑定键盘事件。设置传播方式：父级标签-----当前标签；触发键盘事件时 事件对象存储的是 按键相关的数据信息。事件源标签 和 事件源标签的后代标签 都会触发。
事件的三个阶段
08-12 4639
一个事件的处理过程主要有三个阶段：捕获，目标，冒泡； （1）捕获：当我们在 DOM 树的某个节点发生了一些操作（例如单击、鼠标移动上去），就会有一个事件发射过去。这个事件从 Window 发出，不断经过下级节点直到触发的目标节点。在到达目标节点之前的过程，就是捕获阶段（Capture Phase）。（所有经过的节点，都会触发这个事件。捕获阶段的任务就是建立这个事件传递路线，以便后面冒泡阶段顺
js里面的【事件的三个阶段】
sinat_21234899的博客
09-28 1448
js里面的事件的三个阶段分别为：捕获、目标、冒泡阶段。 1、捕获：事件由页面元素接收，逐级向下，到最具体元素的， 2、冒泡：跟捕获相反，由最具体的元素接收，逐级向上，到页面元素， 3、目标：最具体的元素 例如点击一个button时的触发事件过程如下：
js事件触发
zhengying5dvhdg的博客
12-09 3199
js事件，冒泡事件，Event对象，事件委托，移动端事件
js中事件的三个阶段
CSDN_of_wmy的博客
08-20 689
事件的处理过程主要有三个阶段：捕获阶段，目标阶段，冒泡阶段； 捕获阶段：当我们在 DOM 树的某个节点发生了一些操作例如点击，移入等操作，就会有一个事件发射过去。这个事件从 Window 发出，不断经过下级节点直到触发的目标节点。在到达目标节点之前的过程，就是捕获阶段。事件由页面元素接收，逐级向下，到具体的元素。是由外部向内部传递的过程目标阶段：当事件不断的传递直到目标节点的时候，最终在目标节点...
JavaScript-5-事件触发机制、三种触发方式
qq_38328762的博客
08-22 1977
事件触发机制 事件源【就是网页中的标签】 button 事件 onclick 单击 ondblclick 双击 行为【js】 show() 触发方式一：标签内 οnclick=“func()” <body ondblclick="show()"> <button type="button" onclick="change()" id="btn">点击</...
JS 事件触发机制
qq_34416331的博客
01-01 2480
目录 一、JS 事件机制 二、事件阶段划分 三、注册事件 四、取消事件传递 五、为什么要阻止事件传递？ 六、e.preventDefault() 和 e.stopPropagation() 的区别 七、事件解绑 八、事件代理 (事件委托) 一、JS 事件机制 JS 的事件机制其实就是事件在 DOM 上的传递顺序，并且我们可以对应阶段对这些事件进行获取和处理。 可以看到 l...
JavaScript中事件及其详解
qq_46642326的博客
11-16 1165
JS的dom操作可以改变网页内容，结构和样式，我们就可以利用dom操作元素来改变元素里面的内容属性等。：回调函数的特点：自己把这个函数代码写出来了，但是这个函数不是自己负责调用，由其他程序负责调用该函数。onmouseover和onmouseenter的区别：前者会影响子元素的触发事件，后者不会影响。onmouseover：鼠标移入某个元素触发。【修改元素属性】：先获取元素，注册事件，处理程序，然后直接调用元素的属性赋值。onkeyup：某个键盘按键被松开。事件源：事件被触发的对象，就是谁触发了这个事件。
JS事件三个阶段
Sumshine12.5
02-26 2086
事件的处理过程主要有三个阶段：捕获阶段，目标阶段，冒泡阶段； 1.捕获阶段 当我们为某个元素绑定事件时，事件触发前会经历事件捕获阶段 如图 我们给某个div注册点击事件的时候，会经历事件捕获阶段，事件从最外层捕获一直找到当前绑定事件的元素这里称为事件目标阶段，然后触发click事件（）。 2.目标阶段 当事件从最外层不断传递到目标节点的时候，最后在目标节点触发事件。 3.事件冒泡 当事件触发的时...
JavaScript事件模型详解：异步与事件阶段
为了控制事件处理阶段，可以使用`addEventListener`方法的第三个参数，设定为`true`表示在捕获阶段监听，`false`（默认）表示在冒泡阶段监听。例如： ```javascript element.addEventListener('click', function() ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值