jqurey的事件委托

1.什么是事件委托？
事件委托是利用事件冒泡来实现，只指定一个事件处理程序 来管理某一类型的所有事件。

2.为什么要用事件委托
1) 在js中添加到页面的事件处理程序的个数直接关系到页面的整体加载速度
因为每个事件处理程序都是一个对象，对象会占用内存。对象越多需要加载的内存就越多
2) 有很多个数据的表格以及很长的列表逐个添加事件，对于开发人员而言，就是噩梦。
so： 事件委托能极大的提高页面的加载速度 ，减少开发人员的工作量

原生js 中 事件委托

     <style>
        .list{
            width: 100px;
            height: 40px;
            border: 1px solid;
            text-align: center;
            line-height: 40px;
            list-style: none;
        }
    </style>
	<ul>
    	 <li class="list">1</li>
   		 <li class="list">2</li>
   		 <li class="list">3</li>
   		 <li class="list">4</li>
   		 <li class="list">5</li>
    	 <li class="list">6</li>
	</ul>
     <script>
       var uls = document.getElementsByTagName("ul")[0];
       var lists = document.getElementsByClassName("list");
         uls.addEventListener("click",function (ev) {
         var target = ev.target;
         var color = ev.target.style.backgroundColor;  //红色
         if (target.nodeName == "LI") {
         //效果1：
          for (var i = 0; i < lists.length; i++) {
                lists[i].style.backgroundColor = "white";
                 }
         //效果2：
          if (color == "white" || color == "") { // false
                target.style.backgroundColor = "red";
                 }
             }
         })
         </script>

jq事件委托

      $("ul").on("click",".list",function (ev) {
            var target = $(ev.target);
            target.css("background-color","red");
        })

事件委托的使用场景/作用：
1.操作子元素时，不用一一遍历，可以根据是事件触发的对象来进行相应的操作
可以为DOM当中的很多元素去绑定 “相同的” 事件
2.将事件委托给父级后，动态创建(删除)的子元素不同重新绑定(解绑)事件，实现了事件和元素的同步更新

适用性：
1. focus(), blur() 这两个方法本身没有事件冒泡，所以无法使用事件委托
2. mouseover, mouseout这两个事件的触发率较高，经常需要计算，所以偶尔会出现卡顿。偏差
3. 比较适用的有： click mousedown mouseup keydown keyup keypress
jquery中addClass、removeClass、toggleClass的使用？
　　$(selector).addClass(class)：为每个匹配的元素添加指定的类名$(selector).removeClass(class)：从所有匹配的元素中删除全部或者指定的类，删除class中某个值;
　　$(selector).toggleClass(class)：如果存在(不存在)就删除(添加)一个类$(selector).removeAttr(class);删除class这个属性;;