jquery ,zepto on 事件绑定执行顺序

Paste_Image.png

1.实验过程

---

• Dom 结构

     A 
    

           B 
          

               C
               

                     D
               
         
     
 

• Js 脚本

• Css 样式

• 绑定组合

A on C 后 ，A on D 先
 A on C 后 ，B on C 先
A on C 后 ， B on D 先
A on D 后 ，B on C 先
A on D 后 ，B on D 先
B on C 后 ， B on D 先

2.实验结果

• 结论
  jquery —> 父同子近先，父异（子同或不同）父近先。都与顺序无关
  zepto —> 父同子异顺序先，父异（子同或不同）父近先（与子顺序无关）。

---

3.分析结果

Zepto.js

Paste_Image.png

jQuery.js

Paste_Image.png

Paste_Image.png

• 结论

zepto.js 的事件委托:

在代码解析的时候，所有document的所有 click 委托事件都依次放入一个队列里，click 的时候先看当前元素是不是.a，符合就执行，然后查看是不是.b，符合就执行。

jquery.js 的事件委托:

document上委托了2个 click 事件，click 后判断是否当前符合条件（选择符），然后把事件拿出来执行。