事件委托

实现的功能-------点击li的时候,弹出它的内容

原理:利用事件冒泡,和事件源对象进行处理

优点:  1.不需要循环所有元素,性能较好

          2.当有新的子元素添加的时候,不需要重新绑定事件

html部分

        <ul>

                   <li>1</li>

                   <li>2</li>

                   <li>3</li>

                   <li>4</li>

                   <li>5</li>

                    <p>我是p标签</p>

                    .....

         </ul>

js部分

            var ul= document.getElementsByTagName('ul')[0];

                    ul.onclick=function(e){

                                var event= e||window.event;

                                var target= event.target||event.srcElement;

                                 if(target.nodeName.toLowerCase()== 'li'){

                                              alert(target.innerHTML);

                                 }

                   }