事件委托
又称事件代理,说到事件委托我们就想到了事件冒泡 那么他们具体是什么呢?
事件代理:是js中常用绑定事件的常用技巧,即 把原本需要绑定在子元素上的响应事件(click,keyup,keydown,,,),委托给父元素,让父元素担任事件监听的职务,事件委托的原理就是DOM元素的事件冒泡。
优点:①可以大量节省内存占用,减少事件注册 ②代码整洁 ③可以实现当新增子对象时,无需再次对其绑定(动态绑定事件)
基本实现:
<ul>
<li>1111</li>
<li>2222</li>
</ul>
实现:
<script>
//使用事件委托的代码
var ul=document.getElementsByTagName('ul')[0];
ul.addEventListener('click', function(e){
alert(e.target.innerHTML);
}, false);
//不使用事件委托,循环给li添加click事件
var li=document.getElementsByTagName('li')
for(var i=0;i<li.length;i++){
li[i].onclick=function(){
alert(this.innerHTML);
}
}
</script>