JavaScript的事件处理分为两个阶段:

  • 捕获阶段:从根节点向event.target层层传递
  • 冒泡阶段:从event.target向根节点层层传递

addEventListener(eventName,eventHandler,useCapture)这个函数的第三个参数表示是否使用捕获阶段,默认值为false。
useCapture默认值为false表示优先把事件的处理权交给子元素去处理。如果祖先结点在捕获阶段就把事件给处理掉了,子孙结点可能会感到一脸懵逼。
useCapture=false,所表达的含义就是:如果一件事孩子们能处理好,那就让孩子们去处理吧。

参考资料

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

addEventListener和JavaScript的事件机制的更多相关文章

  1. JavaScript的事件机制

    JavaScript的事件机制 摘要 事件是将JavaScript脚本与网页联系在一起的主要方式,是JavaScript中最重要的主题之一,深入理解事件的工作机制以及它们对性能的影响至关重要.本文将详 ...

  2. 深入研究JavaScript的事件机制

    本篇开始将回顾下Javascript的事件机制.同时会从一个最小的函数开始写到最后一个具有完整功能的,强大的事件模块.为叙述方便将响应函数/回调函数/事件Listener/事件handler都称为事件 ...

  3. JavaScript系列----事件机制

    1.事件流 1.1.标准事件流 所谓的标准事件流指的的:EMCAScript标准规定事件流包含三个阶段,分别为事件捕获阶段,处于目标阶段,事件冒泡阶段. 下面是一段html代码,根据代码来说明标准事件 ...

  4. 从八道面试题看JavaScript DOM事件机制

    As we all know,事件机制其实很简单,无非冒泡和捕获这两点,笔者不再赘述,网上相关文章一大堆,下面让我们直接看面试题 题目一到七,统一设置css .test2 { height: 50px ...

  5. javascript的事件机制(百度文库)

    http://wenku.baidu.com/view/9c8761e1524de518964b7d65.html http://wenku.baidu.com/view/1c3d7228bd6478 ...

  6. 【探讨】javascript事件机制底层实现原理

    前言 又到了扯淡时间了,我最近在思考javascript事件机制底层的实现,但是暂时没有勇气去看chrome源码,所以今天我来猜测一把 我们今天来猜一猜,探讨探讨,javascript底层事件机制是如 ...

  7. 【初窥javascript奥秘之事件机制】论“点透”与“鬼点击”

    前言 最近好好的研究了一番移动设备的点击响应速度,期间不断的被自己坑,最后搞得焦头烂额,就是现在可能还有一些问题,但是过程中感觉自己成长不少, 最后居然感觉对javascript事件机制有了更好的认识 ...

  8. JavaScript——事件机制

    事件是将JavaScript脚本与网页联系在一起的主要方式,是JavaScript中最重要的主题之一,深入理解事件的工作机制以及它们对性能的影响至关重要.本文将详细介绍JavaScript的事件机制, ...

  9. 对JavaScript事件机制的一点理解

    JavaScript通过事件机制实现了异步操作,这种异步操作可以使CPU可以在IO任务的等待中被释放出来处理其他任务,等待IO结束再去处理这个任务.这个是一个基本的事件机制. 那么是不是说事件从监听到 ...

随机推荐

  1. 比较好用的移动端适配的两种方案及flexible和px2rem-loader在webpack下的配置

    移动端适配,目前自己常用的两种 方案,参考以下两篇好文 方案一:使用lib-flexible包 https://www.w3cplus.com/mobile/lib-flexible-for-html ...

  2. 在Dynamics CRM中自定义一个通用的查看编辑注释页面

    关注本人微信和易信公众号: 微软动态CRM专家罗勇 ,回复162或者20151016可方便获取本文,同时可以在第一时间得到我发布的最新的博文信息,follow me! 注释在CRM中的显示是比较特别, ...

  3. TCP/IP:完全弄清OSI七层模型

    OSI七层背景概述 诞生于1983年,iso(国际标准委员会)设计并推出. 目的:实现网络行业的兼容性 OSI七层模型与TCP/IP相对应的层次: 一般来说,我们把上三层被称为应用层,下四层被称为数据 ...

  4. SpringBoot+Thyemelaf开发环境正常,打包jar发到服务器就报错Template might not exist or might not be accessible

    这里说一下Thyemelaf的巨坑 写了一个SpringBoot+Thyemelaf的项目,并不是前后端分离.今天想放到linux服务器上玩玩,打成jar包,然后一运行他妈居然报错了,报了一个Temp ...

  5. Oracle有哪些诊断事件

    作者:eygle | [转载请注出处]链接:https://www.eygle.com/archives/2004/12/oracle_diagnostics_events_list.html 经常有 ...

  6. 01-day-vuex的使用

    知识点1===>简单的使用vuex 进行state取值 使用yarn下载 yarn add vuex -D vuex的包叫做 store 跟pages同级 创建store文件夹,文件夹下有sto ...

  7. 后台传给前端字符串为null或解析JSON字符错误——SyntaxError: JSON.parse: unterminated string literal at line 1 column 9018638 of the JSON data

    第一种情况: 第二种情况: 首先看看你的JSONObject或JSONArray的引用有没有Getter()和Setter()方法,这个必须要加上 问题:两张表双向多对一.一对多时.响应给后台使,出现 ...

  8. phpstudy配置虚拟域名

    之前有一篇使用xampp配置虚拟域名,但是不同公司使用的集成环境不同,(xampp是我自己用的,别误解(><) !)这次使用的phpstudy,相比较而言,phpstudy更简单一点 首先 ...

  9. openpyxl的简单使用

    openpyxl的简单使用 openpyxl 操作excel的库,只能操作xlxs 文件, xlrd/xlwt这两个库能兼容xls(2003版) 安装 pip install openpyxl如果ex ...

  10. json.loads() json解码

    有些json数据里面套着json    一次json.loads()后还是会有数据是json格式 { "result": { "error_code": 0, ...