關於JavaScript中註冊和移除事件

標籤：表示   參數   三種方式   執行   document   lis   Google   func   rip   

為元素註冊事件的方式:3個
          1.
          對象.on+"事件類型名字"=事件處理函數(命名函數或者匿名函數)
          例子:
          document.getElementById("btn").onclick=function(){};
          document.getElementById("btn")["on"+"click"]=function(){};
          2.
          對象.addEventListener("事件類型名字",事件處理函數,false);
          第一個參數:沒有on
          第三個參數:false表示的是事件冒泡,如果是true則是事件捕獲
          例子:
          document.getElementById("btn").addEventListener("click",function(){},false);
          3.
          對象.attachEvent("on"+事件類型名字,事件處理函數);
          第一個參數:有on
          例子:
          document.getElementById("btn").attachEvent("onclick",function(){});
        
註冊事件的相容代碼
         * function addEventListener(element,type,fn){
         *   if(element.addEventListener){
         *       element.addEventListener(type,fn,false);
         *   }else if(element.attachEvent){
         *       element.attachEvent("on"+type,fn);
         *   }else{
         *       element["on"+type]=fn;
         *   }
         * }
移除事件三種方式:
         * 1.
         * 對象.on+事件類型名=null;
         * 例子:
         * document.getElementById("btn").onclick=null;
         * 2.
         * 對象.removeEventListener("事件類型名字",fn,false);
         * 例子:
         * document.getElementById("btn").removeEventListener("click",fn,false);
         * 3.
         * 對象.detachEvent("on"+事件類型名字,fn);
         * 例子:
         * document.getElementById("btn").detachEvent("onclick",fn);
         *
         * 移除事件的相容代碼---一定要自己寫
         *
註冊事件和移除事件的方式的區別
         * 1.方法名不同
         * 2.參數不同
         * addEventListener:
         * 第一個參數是事件類型(事件名字),沒有on
         * 第二個參數是事件處理函數
         * 第三個參數是false
         * attachEvent:
         * 第一個參數是事件類型(事件名字),有on
         * 第二個參數是事件處理函數
         * 沒有第三個參數
         * 3.事件執行的時候內部的this指向不同:addEventListener中this是事件來源(誰的事件觸發了)，attachEvent中的this是window
         * 4.一個有on，一個沒有on
         * 5.相容問題:addEventListener在Google和Firefox中都支援,IE11也支援,IE8不支援
         * attachEvent:    IE8支援,Google和Firefox不支援,IE11也不支援
         * 註冊事件的時候可以用命名函數,也可以用匿名函數,如果是移除事件,必須用命名函數
           innerHTML=""不會把元素的事件移除.===需要注意

關於JavaScript中註冊和移除事件