事件委托（事件代理）是什么？有什么用？

首先要说事件委托，那麽必须要明白两个概念，一个是冒泡事件一个是捕获事件，以下是捕获事件与冒泡事件的代码打印，点击span子元素，首先引发事件捕获事件，触发顺序从最外层的元素开始，逐步前往内层，直到达到实际点击触发的元素，然后触发事件结束，开始事件冒泡，事件冒泡与捕获正好相反，从元素内部开始，逐步冒泡到元素的最外层。

			1

---------------------------------------

好了，理解了冒泡事件和捕获事件后，那再理解什么是事件委托，借用一个用的很广泛的例子：有三个同事预计会在周一收到快递。为签收快递，有两种办法：一是三个人在公司门口等快递；二是委托给前台MM代为签收。现实当中，我们大都采用委托的方案（公司也不会容忍那么多员工站在门口就为了等快递）。前台MM收到快递后，她会判断收件人是谁，然后按照收件人的要求签收，甚至代为付款。这种方案还有一个优势，那就是即使公司里来了新员工（不管多少），前台MM也会在收到寄给新员工的快递后核实并代为签收。
在这个例子中前台代替签收或者判断转给的操作其本质上就是一个委托的过程。
然后委托事件可以解决什么样的代码问题呢？
在下述代码中，因为所用的span事件冒泡都会经过最上层的div，所以可以把div想成在上述例子中的前台，而其中的span则是公司里的员工，假如我想要点击每个span都触发一个点击事件，按往常我们怎么做？是不是就每个span都写一个点击事件，如下

		1
		1
		1
	

这样写每次点击都要找一次的span标签，但是如果用事件委托该怎么样？
给前台加个委托事件，也就是给最外层的元素加个事件进行委托判断，拿到事件后根据id或者其他事件标志进行分类，来判断是那个委托者的委托事件即可
代码如下

		

		1
		1
		1
		
	

	function father(event){
				console.log(event);
				var e=event.target;
				switch(e.id){
					case'a':
					console.log('i am a');
					break;
					case'b':
					console.log('i am b');
					break;
					case'c':
					console.log('i am c');
					break;
				}
			}

一来减少了dom操作，二来代码简洁了，还有当如果给父级元素添加元素时，直接添加上节点即可，不用给新添加上的元素进行再次添加操作，因为新加入的元素会直接继承父元素的事件，进行事件委托