JS事件 之内存与性能

1. 有必要限制一个页面中事件处理程序的数量，数量太多会导致大量内存，而且也会让用户更加页面反应不够灵敏。
2. 建立在事件冒泡机制之上的事件委托技术，可以有效减少事件处理程序的数量。

3. <div id="box">
           <input type="button" id="add" value="添加" />
           <input type="button" id="remove" value="删除" />
           <input type="button" id="move" value="移动" />
           <input type="button" id="select" value="选择" />
       </div>
   <script>
       window.onload = function(){
               var Add = document.getElementById("add");
               var Remove = document.getElementById("remove");
               var Move = document.getElementById("move");
               var Select = document.getElementById("select");
               
               Add.onclick = function(){
                   alert('添加');
               };
               Remove.onclick = function(){
                   alert('删除');
               };
               Move.onclick = function(){
                   alert('移动');
               };
               Select.onclick = function(){
                   alert('选择');
               }
               
           }
   </script>

4. 核心：利用冒泡原理，将事件绑定到父元素，减少内存消耗，提升性能；利用event属性找到事件源，将事件定位到具体元素上。
5. 建议在浏览器卸载页面之前移除页面中的所有事件处理程序。

   var btn=document.getElementById("btn");
   EventUtil.addHandler(btn,"click",function(){
   　　btn.onclick=null;                                      
   　　document.getElementById("div").innerHTML="processing...";
   });
   

   　　解决方法： 手动移除