有关jquery live的效率的问题

  我们有一次代码评审的会议上,说起live的影响效率的事情,众所周知它最直观的好处在于可以一直“监听”我们操作,对于新增的DOM节点也会有效,而不需要重新绑定。也许是因为这个“监听”让我自然的联想到他会不断的去绑定、判断,会造成性能问题,而我理所当然的认为这绝对他妈的浪费内存,而这一切在我看了一篇博文后,为自己理所当然而脸红!下面是某位大神的测试数据,我们来see see

//环境:IE8。 工具:sIEve。 jQuery:1.42
//普通方式:

jQuery(function($){
    var li = '<li><a href="#">test</a></li>',
    newLi = li;
    
    for (i = 0; i < 6000; i++) {
          newLi += li;
    };
    $('#test').html(newLi);
    $('#test a').click(function(){
          alert(0);
          return false;
    });
});
//测试结果:绑定前 20880KB | 绑定后 64932KB | 执行事件后 64980KB

//live 代理方式:

jQuery(function($){
    var li = '<li><a href="#">test</a></li>',
    newLi = li;
    
    for (i = 0; i < 6000; i++) {
          newLi += li;
    };
    $('#test').html(newLi);
    $('#test a').live('click', function(){
          alert(0);
          return false;
    });
});
//测试结果:绑定前 21056KB | 绑定后 20936KB | 执行事件后 20936KB

也需你会和我一样很震惊,怎会他妈的这样!

首先我大致研究了jquery的live 的实现。其原理是利用事件的冒泡

document.onclick= function(event){
    if ($(event.target) =='你live哪个元素') {
                        //do something
    }
}

就是 冒泡到 document 在做处理,而不是实时监听,当你点击哪个元素,触发冒泡,效率影响应该不大,请放心饮用
ps : 大神的东西,当然会考虑效率。如果有所怀疑,请用数据说话,不能想淡然。

大家有什么想法一起讨论,仅一家之言

原文地址:https://www.cnblogs.com/liuzhang/p/2850079.html