事件委托是利用事件的冒泡原理来实现的，何为事件冒泡呢？就是事件从最深的节点开始，然后逐步向上传播事件，举个例子：页面上有这么一个节点树，div>ul>li>a;比如给最里面的a加一个click点击事件，那么这个事件就会一层一层的往外执行，执行顺序a>li>ul>div，有这样一个机制，那么我们给最外面的div加点击事件，那么里面的ul，li，a做点击事件的时候，都会冒泡到最外层的div上，所以都会触发，这就是事件委托，委托它们父级代为执行事件。

     
    
      
P
    
      
H1
     

var div = document.querySelector('div');div.addEventListener('click',function(e){    var ele = e.target;    while(ele.tagName !== 'H1'){        ele = ele.parentNode;        if(ele === div){            ele = null;            break;        }    };    if(ele){        console.log('点击了div中的h1');    }else{        console.log('未点击div中的h1');    }});

想要对h1进行某种事件 首先获取外层div元素 给div添加一个点击事件 当点击内部子元素时,

首先判断当前点击元素是否正好是h1 如果是则执行'点击了div中的h1' 否则将当前元素变为他的父元素 再次进行判断 直到找到h1,

如果已经找到了外层的div 还没有找到h1 则说明点击的并不是h1或其子元素 没有必要继续向外层查找 所以 将当前元素赋值为null,退出while循环 执行'未点击div中的h1'.