javascript 事件冒泡 和 事件委托

js里的事件：

        鼠标键盘事件：onclick、ondbclick、onmousedown、onmouseup、onmouseover、onmousemove、onmouseout、

                                 onkeypress、onkeydown、onkeyup；

        页面事件：onload、onunload、onresize、onerror、onabort；

        表单相关事件：onblur、onchange、onfocus、onreset、onsubmit；

1、事件冒泡：

        单击绿色的div，也会触发红色div的click处理函数 。先捕获绿色div（最内层）的click事件，再逐级往上捕获父级的click事件，直到被阻止冒泡或捕获到“最父级”元素。

        使用  event.stopPropagation() 阻止事件冒泡。

2、事件委托：

        事件冒泡机制对于dom元素绑定事件处理函数 不容易管理，得对每个事件函数阻止冒泡。

        如果ul里面有100个li，需要对每个li添加click函数。js绑定的dom事件函数越多，dom操作越多，界面交互就越多，界面就越不流畅。

         js的event对象里面，有三个属性 event.target(chrome)、event.srcElement(IE,等价于chrome的target属性)，event.currentTarget，event函数里的this表示绑定事件的dom元素，currentTarget等价于this，target和srcElement表示触发事件函数的dom元素（并不是只有绑定事件处理函数的dom元素才会触发事件函数，如果绿色div未绑定click函数，单击绿色div，同样会触发红色div的click函数）。

        事件委托，也叫做事件代理。在“事件冒泡”部分说的是怎么阻止事件冒泡，“事件委托”说的是怎么利用事件冒泡。

         想要的功能是5个li有相应的click事件处理函数。并不必给li添加事件处理函数，而是给ul添加click函数，在ul的click函数中，判断event.target是哪个li，然后再执行相应的函数。相关函数还是要定义的，只是没有直接把函数绑定到li的click事件。li把事件处理委托给了ul，ul代理了li。。。