zoukankan      html  css  js  c++  java
  • js 事件冒泡、捕获;call()、apply()

    他们是描述事件触发时序问题的术语。事件捕获指的是从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..]);
  • 相关阅读:
    POJ 3261 Milk Patterns (求可重叠的k次最长重复子串)
    UVaLive 5031 Graph and Queries (Treap)
    Uva 11996 Jewel Magic (Splay)
    HYSBZ
    POJ 3580 SuperMemo (Splay 区间更新、翻转、循环右移,插入,删除,查询)
    HDU 1890 Robotic Sort (Splay 区间翻转)
    【转】ACM中java的使用
    HDU 4267 A Simple Problem with Integers (树状数组)
    POJ 1195 Mobile phones (二维树状数组)
    HDU 4417 Super Mario (树状数组/线段树)
  • 原文地址:https://www.cnblogs.com/hui-run/p/7462071.html
Copyright © 2011-2022 走看看