js绑定事件和解除事件

绑定事件三种方法，
第一种，

<div style="width: 100px;height: 100px;background-color:red;"></div>
     var div =document.getElementsByTagName('div')[0];
	 div.onclick=function(){
          console.log('a')
          console.log(this)
 }//this本应该指向div元素,但是这里并没有指向dom本身，而且他不被读取
     div.onclick=function(){
         console.log('b')
     }//b 对一个元素绑定两个这样的事件时,后者会覆盖前者

第二种方法,obj.addEventListener(事件类型,事件函数,flase)
这个方法可以为同一个dom元素绑定多个事件

  div.addEventListener('click',function(){
   	 console.log('a')
	 console.log(this)//this指向自身
   },false)
  div.addEventListener('click',function(){
     console.log(this)
     console.log(a)
   },false)//a a

第三种方法,obj.attachEvent(‘on’+type,fn) 只有ie支持,其他浏览器不支持

    div.attachEvent('onclick',function(){
         console.log(this)
    })//this指向window,但是我用ie也不识别该函数

2,点击li按顺序输出li序号事件

		<ul>
            <li>a</li>
            <li>a</li>
            <li>a</li>
        </ul>

 var li=document.getElementsByTagName('li');
     for(let i=0;i<=li.length-1;i++){
         li[i].addEventListener('click',function(){
            console.log(i)
          },false)
    //如果用var而不是let,那么点击任何一个li都会是3

  var li=document.getElementsByTagName('li');
      for(var i=0;i<=li.length-1;i++){
       (function(i){
          li[i].addEventListener('click',function(){
                console.log(i)
           },false)
      }(i))
 	}//闭包也可以处理


//封装一个兼容各个浏览器的绑定事件函数
 function addEvent(element , type,handle){
      if(element.addEventListener){                        element.addEventListener(type,handle,false);
     }else if(element.attachEvent){                        element.attachEvent("on"+type,function(){
       handle.call(element)
     })
    }else{
        element['on'+type]=handle
    }
}

3解除事件

div.onclick=null

	1		div.onclick=function(){
                console.log('b')
                this.onclick=null;
            }
            //只生效一次的点击事件

2		 div.addEventListener=function text(){
                console.log('b')
            }
            div.removeEventListener('click',text , false)

3			ele.detachEvent('on'+type,fn);
			如果绑定匿名函数,则无法解除