首先要说事件委托,那麽必须要明白两个概念,一个是冒泡事件一个是捕获事件,以下是捕获事件与冒泡事件的代码打印,点击span子元素,首先引发事件捕获事件,触发顺序从最外层的元素开始,逐步前往内层,直到达到实际点击触发的元素,然后触发事件结束,开始事件冒泡,事件冒泡与捕获正好相反,从元素内部开始,逐步冒泡到元素的最外层。
<div id="div1">
<span id="span1">1</span>
</div>
---------------------------------------
<script>
window.onload=function(){
var div1 = document.getElementById('div1');
var span1 = document.getElementById('span1');
div1.addEventListener('click', function(e) {
console.log('father的捕获事件');
}, true);
div1.addEventListener('click', function(e) {
console.log('father的冒泡事件');
}, false)
span1.addEventListener('click', function(e) {
console.log('son的捕获事件');
}, true)
span1.addEventListener('click', function(e) {
console.log('son的冒泡事件');
},