浏览器事件机制

作者: 马建阳 | 来源:发表于2017-06-16 17:47 被阅读71次

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

基础知识

  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你孩子被点击了是否需要处理一下
注:若点击的是你自己,就没有什么捕获和冒泡,谁先监听就先触发谁。

相关文章

  • --

    react事件机制 react基于浏览器原生事件机制,封装了一套自己的事件机制,包括事件注册、事件合成、冒泡和捕获...

  • JavaScript 异步编程的几个方法

    原文地址基于浏览器事件轮回机制(以及nodejs中的事件轮询机制),JavaScript常常会运行在异步环境中。而...

  • 阻止浏览器事件冒泡

    不同的浏览器对事件的解析机制不同,所以就会触发不同的事件,影响我们操作,如何取解决浏览器事件冒泡 ,所谓的事件冒泡...

  • 16.3 JavaScript的执行机制

    浏览器事件轮询机制 js执行为单线程 网络请求、setTimeout、addEventListener属于异步事件...

  • 2020最新面试题

    1.react生命周期 新特性 redux router 2.js事件运行机制 3.浏览器缓存机制 4.浏览器存...

  • 浏览器事件机制

    本意是讲 react 事件机制的,但仔细想想..我连浏览器本身的事件机制也不是十分清晰 事件传播 事件传播的三个阶...

  • 浏览器事件机制

    浏览器事件机制(即冒泡和捕获,也称为事件流) 基础知识 操作系统最先知道用户点击了鼠标,浏览器次之 child 被...

  • 浏览器事件机制

    一、概述 浏览器事件流存在三个阶段:捕获阶段、目标阶段、冒泡阶段,捕获和冒泡是事件传播的两种截然相反的方式。 二、...

  • 浏览器事件机制

    概述 浏览器事件传播存在三个阶段:捕获阶段,目标阶段,冒泡阶段 捕获阶段:从window对象派发到事件目标的父级的...

  • 浏览器和Node事件循环的区别

    事件循环,是 js 中老生常谈的一个话题了,而在浏览器和 Node 中的事件循环执行机制也不相同,浏览器的事件循环...

网友评论

    本文标题:浏览器事件机制

    本文链接:https://www.haomeiwen.com/subject/qwjmqxtx.html