事件绑定，事件监听，事件委托

事件绑定，事件监听，事件委托

事件绑定

一个元素只能绑定一个事件

obj.on+事件名称=funciton(){

}

事件监听

事件监听可以监听很多很多事件。

this指向当前调用触发事件的主体对象。

添加：

obj.addEventListener("事件名称",funciton (){},boolean)

解绑：

但是这样不能删除↓：

obj.addEventListener("事件名称",funciton fn (){console.log("1")},boolean)

obj.removeEventListener("事件名称",funciton fn (){console.log("1")},boolean)

因为不是同一个对象,因为地址不一样。(内存空间不一样！)

想要删除只能：

funciton fn (){console.log("1");}			//内存空间一样了

obj.addEventListener("事件名称",fn,boolean)

obj.removeEventListener("事件名称",fn,boolean)

解绑本function（严格模式里不能用

let i=0;
demo.addEventListener("click",function(){
	console.log("当前点击了"+(i++)+"次");
	if(i>9){
		demo.removeEventListener("click",arguments.callee);
	}
})

attachEvent：

事件监听封装函数：

let EventUtil={
	addHandle:function(ele,type,handle,boo){
        if(ele.addEventListener){
            ele.addEventListener(type,handle,boo)
        }else if(ele.attachEvent){
            ele.attachEvent("on"+type,handle,boo)
        }else{
            ele["on"+type]=handle;
        }
    },
    removeHandle:function(ele,type,handle,boo){
        if(ele.removeEventListener){
            ele.removeEventListener(type,handle,boo)
        }else if(ele.removeEvent){
            ele.removeEvent("on"+type,handle,boo)
        }else{
            ele["on"+type]=handle;
        }
    }
}
function fn(){
    console.log("a");
}
EventUtil.addHandle(demo,"click",fn,false);

事件委托

target是指事件函数是给哪一个值触发的（具体哪个元素

ev.target.tagName==="LI"

//ex    target是火狐，谷歌都有的
obj.addEventListener("click",funciton(ev){
    if(ev.target.tagName==="LI"){
    	fn();
	}
 })

UI事件

鼠标事件