前几天面试,被问到一个问题,“为动态添加的li绑定点击事件怎么实现”,大家都知道找到li元素,然后lisObj.onclick = function(){},这样是不能为新增加的li加事件的。解决办法是使用事件委托,那么名词解释来了,什么是事件委托:利用事件冒泡,在父元素上绑定事件,而不是在子元素上,当子元素被点击时,会冒泡到父元素上触发事件。
优点显而易见,性能高,不用每个元素绑定事件,灵活,不需要大量操作element,还能解决上面场景的问题
下面是一段demo
var ulObj = document.getElementById('ulId'); ulObj.addEventListener('click', function(e){ e = e || window.event; var target = e.target || e.srcElement; // target是具体的li对象,可以做一些其他操作 }, false);