注冊事件（三種方式）

on的方式

語法：事件源.on+事件類型 = 事件處理程序

缺點：只能注冊一次同類型的事件，如果多次注冊，會覆蓋(賦值的方式容易被后面注冊的事件覆蓋)

      btn.onclick = function() {
        //ul.removeChild(li5);   
          ul.removeChild(ul.children[ul.children.length-1]);
      }

addEventListener的方式 -- 添加事件監(jiān)聽

語法：事件源.addEventListener("事件類型",事件處理程序,false); (false可有可無)

優(yōu)點：不會出現(xiàn)覆蓋問題，協(xié)同工作的時候推薦使用
兼容：ie8及以下瀏覽器不支持

close[i].addEventListener('click', function () {
    this.parentNode.parentNode.style.display = 'none';
})

attachEvent的方式

語法：事件源.attachEvent("on"+事件類型,事件處理程序函數(shù))
兼容：只有ie5~ie10支持，ie11開始放棄，不支持主瀏覽器

btn.attachEvent('onclick',function(){
    console.log(123);
})

封裝瀏覽器兼容問題的函數(shù)

    /* * 一般是函數(shù)的功能： 兼容的注冊事件
     * @param element 要注冊事件的元素對象
     * @param type      要注冊的事件類型
     * @param callback  事件的處理程序
     */
    function addEvent(element,type,callback){
      //判斷要注冊事件的元素是否可以通過addEventListener來注冊
      if(element.addEventListener != undefined){
          //可以，執(zhí)行這一步
           element.addEventListener(type,callback,false);
       }
          //不可以 ， 判斷要注冊事件的元素是否可以通過attachEvent 來注冊
        else if( element.attachEvent != undefined){
            //可以使用attachEvent 來注冊
            element.attachEvent('on'+type,callback);
        }
    }

    /* != undefined  可以不寫*/

移除事件(三種方式)

on的方式移除

語法：事件源.on+事件類型 = null

//使用on的移除事件
btn.onclick = function(){
    console.log(123);
    this.onclick = null;
}

addEventListener的方式移除

語法：事件源.removeEventListener(事件類型,要移除的函數(shù)名)

//   使用removeEventListener移除事件
function fn2(){
    console.log(456);
    this.removeEventListener('click',fn2,false);
}

attachEvent的方式移除

語法：事件源.detachEvent("on"+事件類型,函數(shù)名)

//使用detachEvent移除事件
var fn = function(){
    console.log(123);
}
function fn2(){
    console.log(456);
    btn.detachEvent('onclick',fn2);
}
btn.attachEvent('onclick',fn);
btn.attachEvent('onclick',fn2);