展开

关键词

JavaScript

通俗地来说, JavaScript 描述的是在 DOM 里面的传递顺序,以及我们可以对这些做出如何的响应。假设我们具有一个 ul 元素,其包括很多 li 元素。 简单范例在接下来的博文中,我们通过以下范例对进行介绍。 Google 三个阶段JavaScript 触发有三个阶段。 注册通常我们使用 addEventListener 注册,该函数有一个 useCapture 参数,该参数接收一个布尔值,默认值为 false ,代表注册为冒泡。 target 是触发的某个具体的对象,只会出现在的目标阶段,即“谁触发了,谁就是 target ”。currentTarget 是绑定的对象。 但通过传播,我们可以在 ul 注册 eventListener 。这样的好处有亮点:节省内存不需要给子节点注销参考资料DOM 的傳遞機:捕獲與冒泡

23630

Javascript propagation

如果是采用jQuery的click方法绑定的处理,只需在处理函数里返回false即可: ?

11520
  • 广告
    关闭

    云产品限时秒杀

    云服务器1核2G首年50元,还有多款热门云产品满足您的上云需求

  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JavaScript 循环

    javascript是一门单线程的非阻塞的脚本语言。单线程意味着javascript在执行代码的任何时候,都只有一个主线程来处理所有的任务。那么javascript引擎是如何实现这一点的呢? 因为循环(event loop)。 先上图:image.png图片解读:同步和异步任务分别进入不同的执行场所,同步的进入主线程,异步的进入Event Table并注册函数当指定的情完成时(重点),Event Table会将这个函数移入Event Queue中主线程内的任务执行完毕为空,会去Event Queue读取对应的函数,进入主线程执行上述的过程会不断的重复,也就是常常说的Event Loop(循环)。 参考&后话 juejin.impost5bac87… juejin.impost5b498d… juejin.impost5bee24… 文章首发javascript循环,更多的内容,请戳我的博客进行了解

    15030

    解析Javascript冒泡

             在浏览器客户端应用平台,基本生都是以驱动的,即某个发生,然后做出相应的动作。         浏览器的表示的是某些情发生的信号。 的阐述不是本文的重点,尚未了解的朋友,可以访问W3school教程 进行了解,这将有助于更好地理解以下的内容 。 2.冒泡 什么是冒泡呢?         一般地,在传递过程中会有一些信息,这些是的组成部分:发生的时间+发生的地点+ 的类型+的当前处理者+其他信息,? 由此我们会有下面的javascript片段: window.onload = function() { document.getElementById(box1).addEventListener(click 方法二:包含最初触发的节点引用 和 当前处理节点的引用,那如果节点只处理自己触发的即可,不是自己产生的不处理。

    25840

    JavaScript循环解析

    并不仅仅是因为面试遇到了,而是理解JavaScript循环会让我们平常遇到的疑惑也得到解答。 循环JavaScript是单线程,非阻塞的浏览器的循环执行栈和队列宏任务和微任务node环境下的循环和浏览器环境有何不同循环模型宏任务和微任务经典题目分析1. 页面渲染,各种IO的完成等随时被添加到任务队列中,一直会保持先进先出的原则执行,我们不能准确地控这些被添加到任务队列中的位置。 (回调)MutationObserver(html5 新特性)运行异步任务的返回结果会被放到一个任务队列中,根据异步的类型,这个实际上会被放到对应的宏任务和微任务队列中去。 中的Event Loop(循环)JavaScript 运行详解:再谈Event LoopNode 定时器详解面试题:说说循环(满分答案来了)极客浏览器工作原理与实践微任务、宏任务与Event-LoopJavaScript

    23020

    javascript循环–event loop

    在前面我介绍过一遍文章--javascript异步编程使用方法,现在要说的是js单线程是如何实现异步的。 答案就是是通过的循环(event loop),理解了event loop,就理解了JS的执行。 于是乎就产生了一种执行:首先判断代码是同步还是异步,如果是同步则进入主线程,如果是异步代码就进入event table;异步任务在event table中注册函数,当异步代码达到执行条时,就被推入到 以上的三步基本上就构成了一个的循环--event loop。当然这并不是一个完整的时间循环,其中的异步任务也有宏任务和微任务的区别。 这就是一个完整的时间循环

    16340

    JavaScript驱动&定时器

    在浏览器中,作为一个极为重要的,给予JavaScript响应用户操作与DOM变化的能力;在NodeJS中,异步驱动模型则是提高并发能力的基础。 一、程序如何响应 程序响应外部的有两种方式: 1. JavaScript中的定时器并不同于计算底层的定时中断。中断到来时,当前执行代码会被打断,转去执行定时中断处理函数。 实际上在JavaScript代码执行中,所有的都无法得到处理,必须等到当前代码全部完成,才能去处理新的。这就是为什么在浏览器中运行耗时JavaScript代码时,浏览器会失去响应。 三、定时器的工作原理1. javascript引擎只有一个线程,迫使异步只能加入队列去等待执行。2.

    34561

    高频面试题:JavaScript循环解析

    并不仅仅是因为面试遇到了,而是理解JavaScript循环会让我们平常遇到的疑惑也得到解答。 一般面试官会这么问,出道题,让你说出打印结果。 ().then(回调) MutationObserver(html5 新特性) 运行 异步任务的返回结果会被放到一个任务队列中,根据异步的类型,这个实际上会被放到对应的宏任务和微任务队列中去 深入理解js循环(浏览器篇) 这边文章中有个特别形象的动画,大家可以看着理解一下。 ) JavaScript 运行详解:再谈Event Loop Node 定时器详解 面试题:说说循环(满分答案来了) 极客浏览器工作原理与实践 微任务、宏任务与Event-Loop Node.js 深入理解js循环(Node.js篇) 《一文看懂浏览器循环》 Loupe 其他 最近发起了一个100天前端进阶计划,主要是深挖每个知识点背后的原理,欢迎关注 微信公众号「牧码的星星

    42640

    JavaScript 循环 - 微任务和宏任务的关系

    循环,微任务和宏任务的关系 本文涉及到的名词:循环(Event Loop),宏任务(macro-task)与微任务(micro-task),执行栈和任务队列等。 前言 JavaScript 是单线程的,同一时间只能做一情。 本文所讲的 JavaScript 循环,它主要与异步任务有关。 任务队列 循环主要与任务队列有关,所以必须要先知道宏任务与微任务。 在任务队列中,有两种任务:宏任务和微任务。 循环 那么什么是循环呢? 应用场景 除了在前端面试中,会问到关于循环、执行栈的问题,了解 JavaScript 循环有没有实质的作用呢?

    42420

    JavaScript系列之冒泡简介

    JavaScript系列之冒泡DOM流(event flow )存在三个阶段:捕获阶段、处于目标阶段、冒泡阶段,冒泡顺序是由内到外进行传播,冒泡是由IE开发团队提出来的, ,从内到外执行,所以这个就是冒泡的简单例子最近也遇到了这种情况,所以就去网上搜索资料,简单学习一下,就是点击一个按钮的时候,竟然触发了两次,通过排查,发现了冒泡导致的,解决方法是禁用冒泡 e.cancelBubble = true$(element).click(function(e){ e.stopPropagation();ie e.cancelBubble = true});当然除了冒泡会导致 onclick被调用两次外,被绑定2次的情况也有可能,解决方法是解除,然后再绑定$(element).unbind(click).click(function() { todo })参考资料: JavaScript 详说之冒泡、捕获、传播、委托:https:www.cnblogs.combfgisp5460191.html

    23120

    浏览器DOM模型分为捕获和冒泡。一个发生后,会在子元素和父元素之间传播(propagation)。 代理用到了两个JavaScript特性:冒泡以及目标元素。当一个元素上的被触发的时候,同样的将会在那个元素的所有祖先元素中被触发。 代理的处理方式有以下优点:节省内存不需要给子节点注销React中的React中的与原生的完全不同,时间没有绑定在原生DOM上,发出的也是对原生的包装。 React内部系统可以分为两个阶段:注册和触发。 React的优点:减少内存消耗,提升性能,一种类型只在document上注册一次统一规范,解决ie兼容问题,简化逻辑对开发者友好

    15011

    nodejs的处理以及

    nodejs的处理以及ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS ;server.on(request,test);server.removeListener(request,test);server.listen(1337,127.0.0.1);3.Node.js循环定义 :当线程中的IO任务完成之后就会执行指定的回调函数,并且将这个完成的放在队列的尾部,等待循环,当主线程再次循环到这个的时候,就会直接处理并且返回给上层调用,这个过程就是循环(Event 应用层:即 JavaScript 交互层,常见的就是 Node.js 的模块,比如 http,fs。V8引擎层:即利用 V8 引擎来解析JavaScript 语法,进而和下层 API 交互。 LIBUV层:是跨平台的底层封装,实现了 循环、文操作等,是 Node.js 实现异步的核心。

    33010

    Node.js的

    29260

    Flex(一)

    Flex贯穿我们整个开发,分为两类,用户和系统,比如说我们在页面点击了一个按钮,这是用户触发的,当组初始化完毕,会触发creationComplete,这是系统。 简单的说,用户是人触发的,系统是flex自身触发的。        这三个阶段中,我们要记住两个对象,target和currentTarget,简单的将,target是引发的源对象,currentTarget是监听这个的对象。 通常来说,target和currentTarget是相同的,比如说我们创建了一个按钮,并在按钮上监听了click,但是如果不是在按钮上监听了click,而是在它的父容器上监听了这个,这时target 到此,内容结束,下一节讲的主要内容是使用在父子组中传输数据。       ps:我的博客刚刚开始写,如果大家对我的博客形式和博文内容有什么建议的话,欢迎提出,下篇《Flex(二)》.

    26000

    Flex(二)

    上一篇简单的介绍了Flex的以及处理的四种方式,本篇的主要内容是利用自定义在父子组之间传递数据。        点击子组的按钮会抛出一个,这个可以被主应用捕捉到并进行处理,显然这个需要我们自定义。         * @param bubbles 是否可以冒泡,true为可以,false为不可以 * @param cancelable 是否可以取消,true为可以,false为不可以 * public ,就像Flex中包含的那些一样。         这里在metadata标签下声明了showInfo,这样,在主应用中引入的自定义组中就会有showInfo属性。        4.

    25000

    Flex(三)

    上一篇主要以代码的方式说明了如何使用自定义在父子组之间传递数据,那么在开发中,我们可能会遇到另一种情况,就是想在任意一个地方监听到任意一个组中被触发的,这样处理更灵活,并不局限于父子组之间 如图所见,该类包含了派发、监听、移出等方法,那么通过这个类就可以实现本文开篇所提出的那种情况,分析一下,监听的对象和派发的对象必须是同一个对象,这样才能被捕获,所以我们需要写一个单例的类 到目前为止,我们的工作已经完成一大半了,在上一篇中设计了一个自定义类,也就是eventsMyEvent.as,我们可以在该类中加入一个dispatch方法,创建完之后可以派发,代码如下:        (this);}       这样,创建完自定义之后,就可以直接派发了,那么使用起来就很方便了,下面是具体使用代码,一个应用中有两个自定义组,组一中有个TextArea,组二中有个按钮,点击按钮 EventTest.mxml        componentscomponent1.mxml        componentscomponent2.mxml        好,这样就实现了在任意一个地方监听到任意一个组中被触发的的功能

    35300

    分发

    Motion Events  传感器:重力、加速度。    3.  Remote Control Events  远程遥控。 先说说Touch Events大致的执行过程;    点击手屏幕 ----> UIKit 会生成一个 UIEvent,把UIEvent分发给当前活跃着的APP ----> 活跃着的APP被告知有发生后 ,UIApplication 单例就从队列中取出最新的,依靠 hit-Testing 找出并且返回你点击的View,让View执行。 上面就是hitTest的一些概念和简单的使用,其实它能做的还是挺多的,我把自己学习的笔记链接全都整理出来给;iOS分发(一) hit-Testing 技术哥iOS分发(二)The Responder Chain 技术哥iOS触摸处理史上最详细的iOS之的传递和响应Motion Events  和  Remote Control Events:    Motion Events ,传感器加速器这两个东西我就不再说我

    31880

    Redis的

    Redis服务器是一个驱动程序,服务器需要处理两类:文(file event)和时间(time event)Redis处理流程? aeMain函数通过调用aeProcessEvents函数来进行文和时间的调度和执行。aeEventLoop中记录了相关的信息。 ,最后再执行时间函数processTimeEvents文Redis的基于Reactor模式开发了自己的网络处理器,这个处理器被称为文处理器(file event handler):文处理器使用 ,当文产生时,这些文处理器就会调用套接字之前关联好的处理器来处理处理器的构成? AE_WRITABLE,触发命令回复处理器执行,当命令回复处理器将命令回复全部写入套接字之后,服务器就会接触客户端套接字的AE_WRITABLE与命令回复处理器之间的关联时间Redis的时间分为定时和周期性

    15710

    js

    什么是流在JavaScript流是指一个沿特定数据结构传播的一个过程。整个流总共包含三个阶段(从dome2来说):1.捕获阶段、2.处于目标阶段、3.冒泡阶段。 从这个图里面我们可以清晰的看到整个流的执行过程,首先是从window开始,一步步的从上向下执行,此过程就是捕获阶段,当到达了的位置以后则处于目标阶段,之后会在向上冒泡,进入的冒泡阶段 触碰完成以后再把手拿出来,正好是一个相反的过程,这就与我们的是一个道理。 2 currentTarget 返回其监听器触发该的元素。 2 eventPhase 返回传播的当前阶段。 委托不知道大家在平时的使用的时候有没有遇到过这样的一种情况,如果涉及到更新HTML节点或者添加HTML节点的时候,就会出现这样的一种情况,新添加的节点无法绑定,更新的节点也是无法绑定,表现的行为是无法触发如下

    26420

    libevent的

    初始化从上一篇文章《libevent是怎么选择底层实现的》可以看出来,调用event_base_new()函数就是初始化好底层实现,给event_base结构体中evsel赋值,evsel是一个eventop 主循环在event.c中有个event_base_dispatch函数,它就是主循环,里面会调用event_base_loop,event_base_loop实现如下:int event_base_loop 处理关于处理,我们还是跟流程,同样以epoll为例,在epoll.c的epoll_dispatch函数中,有如下代码: 里面会调用epoll_wait函数 res = epoll_wait(epollop _,接下来流程如下:event_active_nolock_ --> event_callback_activate_nolock_ --> event_queue_insert_active这样就将插入到了已激活队列中 event_process_active函数,event_process_active调用event_process_active_single_queue函数,event_process_active_single_queue函数会调用上绑定的回调函数进行处理

    11520

    相关产品

    • 事件总线

      事件总线

      腾讯云事件总线(EB)是一款安全,稳定,高效的无服务器事件管理平台,支持腾讯云服务、自定义应用、SaaS应用以标准化、中心化的方式接入,帮助您轻松实现无服务器事件驱动架构。

    相关资讯

    热门标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      扫码关注云+社区

      领取腾讯云代金券