委托事件和jquery中的delegate方法

利用事件冒泡的特性,给父元素绑定事件,然后判断事件对象,来给父元素的每个子元素添加事件,而不是直接在所有的子元素上绑定事件:

<ul>

  <li></li>

  <li></li>

  <li></li>

</ul>

给每个li绑定事件:

li.addEventListener('click',function(){console.log(this)});

通过委托来给li绑定事件:

ul.addEventListener('click',function(e){
if(e.toElement.tagName=='li'){
console.log(this);
return false
}
})

后者只绑定了一次事件,性能上要优于前者.

jquery中提供了更强大的相关方法:delegate

    var ul= $('ul');
ul.delegate('li','click',function(e){
console.log(e);
console.log(this);
})

这样添加的事件,即使是动态添加的li,也可以触发事件

上一篇:haskell中的let和where


下一篇:阅读INI档 - Delphi一片