他们是描述事件触发时序问题的术语。事件捕获指的是从document到触发事件的那个节点,即自上而下的去触发事件。相反的,事件冒泡是自下而上的去触发事件。绑定事件方法的第三个参数,就是控制事件触发顺序是否为事件捕获。true,事件捕获;false,事件冒泡。默认false,即事件冒泡。Jquery的e.stopPropagation会阻止冒泡:该方法将停止事件的传播,阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意,虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用,但是它可以阻止把事件分派到其他节点。

<div id="parent">
  <span id="child"></span>
</div>

  绑定事件:

$('parent').addEventListener('click', function(e) {
console.log('parent事件被触发');
}) $('child').addEventListener('click', function(e) {
console.log('child事件被触发');
})

  当点击的时候:
child被触发
parent被触发

结论:事件的触发顺序由内向外,这就是事件冒泡。

现在改变第三个参数的值为true

$('parent').addEventListener('click', function(e) {
console.log('parent事件被触发');
}, true) $('child').addEventListener('click', function(e) {
console.log('child事件被触发');
}, true)

  结论:先parent,然后child。事件触发顺序变更为自外向内,这就是事件捕获。

obj.call(thisObj, arg1, arg2, ...);
obj.apply(thisObj, [arg1, arg2, ...]);

  call 和 apply 都是为了改变某个函数运行时的 context 即上下文而存在的,换句话说,就是为了改变函数体内部 this 的指向。因为 JavaScript 的函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。两者作用一致,都是把obj(即this)绑定到thisObj,这时候thisObj具备了obj的属性和方法。或者说thisObj『继承』了obj的属性和方法。唯一区别是apply接受的是数组参数,call接受的是连续参数。

call 需要把参数按顺序传递进去,而 apply 则是把参数放在数组里。

适用条件:当你的参数是明确知道数量时,用 call,而不确定的时候,用 apply,然后把参数 push 进数组传递进去。当参数数量不确定时,函数内部也可以通过 arguments 这个数组来便利所有的参数。

函数调用我知道的的几种方式:(js中一切皆是对象)
obj.myFunc();
myFunc.call(obj,arg);
myFunc.apply(obj,[arg1,arg2..]);

js 事件冒泡、捕获;call()、apply()的更多相关文章

  1. js事件冒泡/捕获

  2. 理解js事件冒泡事件委托事件捕获

    js事件冒泡 javascript的事件传播过程中,当事件在一个元素上出发之后,事件会逐级传播给先辈元素,直到document为止,有的浏览器可能到window为止,这就是事件冒泡现象. <di ...

  3. js 事件冒泡、事件捕获、stopPropagation、preventDefault

    转自:http://www.jb51.net/article/42492.htm (1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: ...

  4. js事件冒泡和事件委托

    js事件冒泡 js所谓的事件冒泡就是子级元素的某个事件被触发,它的上级元素的该事件也被递归执行 html: <ul class="clearfix" data-type=&q ...

  5. js事件冒泡和捕捉

    (1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div ...

  6. 这可能是最简明扼要的 js事件冒泡机制+阻止默认事件 讲解了

    哎 js事件冒泡机制和阻止冒泡 阻止默认行为好像永远也整不清楚,记了忘 忘了记...醉了 这篇文章写完以后下次再忘记 就呼自己一巴掌,忘一次一巴掌 首先要明白两个概念——事件和事件流 事件指的是用户或 ...

  7. JS事件冒泡及阻止

    事件冒泡及阻止 当一个元素接收到事件的时候,会把他接收到的事件传给自己的父级,一直到window,当然其传播的是事件,绑定的执行函数并不会传播,如果父级没有绑定事件函数,就算传递了事件,也不会有什么表 ...

  8. 什么是JS事件冒泡?

    什么是JS事件冒泡?: 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理 程序或者事件返回true,那么 ...

  9. 什么是JS事件冒泡

    什么是JS事件冒泡? 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个 ...

  10. 阻止JS事件冒泡传递(cancelBubble 、stopPropagation)

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx. ...

随机推荐

  1. 一元线性回归与R语言

    (https://mirrors.tuna.tsinghua.edu.cn/CRAN/)下载好R之后打开,就可以输入命令,如下,我输入 > y=c(61,57,58,40,90,35,68)  ...

  2. 【ASP.NET】UCenter实现多站点同步注册

    问题描述 上一篇文章写了[ASP.Net]UCenter实现多站点同步登录退出 在整合论坛的时候,同步注册也是相当必要的一个功能:将论坛注册的用户同步到自己的网站,自己网站注册的用户同步到论坛. 官方 ...

  3. 【AtCoder】Tenka1 Programmer Contest 2019

    Tenka1 Programmer Contest 2019 C - Stones 题面大意:有一个01序列,改变一个位置上的值花费1,问变成没有0在1右边的序列花费最少多少 直接枚举前i个都变成0即 ...

  4. BZOJ3240 [Noi2013]矩阵游戏 矩阵 快速幂 卡常

    原文链接http://www.cnblogs.com/zhouzhendong/p/8084891.html 题目传送门 - BZOJ3240 题意概括 F[1][1]=1F[i,j]=a*F[i][ ...

  5. js隐藏元素

    js隐藏元素 $("#serviceType").css('display','none'); js显示元素 $("#serviceType3").css('d ...

  6. Linux安装Tomcat-Nginx-FastDFS-Redis-Solr-集群——【第三集之磁盘分区】

    磁盘分区的概念对接下来的自定义安装Linux具有重要作用.(可以直接先看第四集之Linux安装就能知道分区的重要性) ----------------------------------------- ...

  7. 007 linux环境下的伪分布式环境搭建

    本文的配置环境是VMware10+centos2.5. 在学习大数据过程中,首先是要搭建环境,通过实验,在这里简短粘贴书写关于自己搭建大数据伪分布式环境的经验. 如果感觉有问题,欢迎咨询评论. 零:下 ...

  8. day41 mycql 函数

    一些经典的练习题,以及函数的简单用法,內建函数 -- 函数 python函数 def fun1(a1,a2,a3): sum = a1+a2+a3 return sum fun1(1,2,3) jav ...

  9. TMS320DM642学习----第二篇(软件环境搭建+工程文件结构)

    一.CCS3.3安装: 下载解压CCS3.3的破解安装包如下所示,双击setup准备安装(SEED开发者论坛资料:http://www.seeddsp.com/bbs/forum.php?mod=vi ...

  10. 同一台电脑上个人的github账户如何与公司的gitlab账户共存

    前些天,写了篇博客 开发环境之git:团队协作git工作流与常用命令. 主要是回顾其中的第一小节基本配置. 但是对于很多程序员而言,我们不仅有公司的gitlab账户做公司的业务,也会有自己个人的git ...