浏览器事件机制

浏览器事件机制(即冒泡和捕获,也称为事件流)

基础知识

  1. 操作系统最先知道用户点击了鼠标,浏览器次之
  2. child 被点击了,意味着 parent 也被点击了
  3. 如果我同时监听了 child 和 parent,那么谁先通知我?这是个问题。

捕获阶段

早期 Navigator 支持
parent 先通知,child 后通知

冒泡阶段

IE支持
child 先通知,parent 后通知
(onclick 就是在冒泡阶段被通知)

W3C 事件模型

既支持捕获又支持冒泡(先捕获后冒泡)

举例说明事件机制(混用)

有两个div,一个parent,一个child,parent包含child.当用户点击child时先发生捕获阶段,通知parent你孩子被点击了是否需要处理一下后通知child你被点击了是否需要处理一下,之后发生冒泡阶段先通知child你被点击了是否需要处理后通知parent你孩子被点击了是否需要处理一下
注:若点击的是你自己,就没有什么捕获和冒泡,谁先监听就先触发谁。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一、概述 浏览器事件流存在三个阶段:捕获阶段、目标阶段、冒泡阶段,捕获和冒泡是事件传播的两种截然相反的方式。 二、...
    pz明阅读 1,673评论 0 0
  • 以下文章为转载,对理解JavaScript中的事件处理机制很有帮助,浅显易懂,特分享于此。 什么是事件? 事件(E...
    jxyjxy阅读 3,084评论 1 10
  • js之事件机制 1、事件初探 1.1 js事件的概述 JavaScript事件:JavaScript是基于事件驱动...
    道无虚阅读 2,439评论 0 2
  • 一、问答 1. dom对象的innerText和innerHTML有什么区别? innerHTML: 也就是从对象...
    饥人谷_罗伟恩阅读 653评论 0 2
  • 早上6点半起床,平常都是这个点醒,前一天晚上本想调6点的闹钟,但是星期六,室友们都要睡到10点,于是没调闹钟...
    阿诗丹顿阅读 301评论 0 0