事件委托

原理：通过事件冒泡原理，将事件绑定到父级，触发时子级执行效果

例：为列表的每个选项绑定事件：
var ul = document.getElementsByTagName("ul")[0];	//获取元素
ul.addEventListener("click",function(event){		//为父元素绑定事件监听
	var num = event.target.className;				//获取子元素下标
	if(s == "1"){									//为子元素绑定事件
		绑定事件
		}

事件绑定的优点：

1. 仅在内存中开辟了一块内存空间，节省资源的同时减少DOM操作，提高性能
2. 对于新添加的元素，也会有之前绑定的事件
3. 事件委托能提高页面加载速度，减少代码量

事件绑定的缺点：

1. 在JS添加到页面的时间处理程序个数关系到页面的整体加载速度，每个事件的处理程序都是一个占用内存的对象，对象越多需要加载的内容也越多
2. 数据很多的表格及列表，逐个添加事件的话代码太过繁琐

Jquery中的事件委托

使用方式： $(父级).on(触发条件，触发元素，执行函数);
例：$(ul).on("click","li",changecolor);
适用场景：

1. 操作子元素时不用一一遍历，可由事件触发对象进行相应操作（为很多元素绑定相同事件）
2. 将事件委托给父级后，动态创建/删除的子元素不用重新绑定/解绑事件，实现事件和元素的同步更新

适用性：

1. focus、blur两个方法本身没有事件冒泡，所以无法使用事件委托
2. mouseover和mouseout两者触发频率较高，计算繁多，绑定的话页面偶尔会出现卡顿
3. 适合帮顶给click,mousedown,mouseup,keydown,keyup和keypress