HTML学习笔记之事件处理程序

html事件处理有以下几种

• 1.html事件处理程序
  直接在html中写onclick=”“事件
• 2.DOM0级事件处理程序件处理程序)
  取出id，然后给id.onclick=function(){}(可以是匿名函数，也可以是已存在函数)
• 3.DOM2级事件处理程序(可以添加多个事件处理程序)
  DOM2级定义了两个方法addEventListener()和removeEventListener()
  接受三个参数：要处理的事件名称、作为事件处理程序函数和布尔值（其中true表示捕获阶段调用事件程序，false表示冒泡阶段调用事件程序，所以一般都是false）
  id.addEventListener(“click”,oneFunction);（去掉on）
• 4.IE事件处理程序（只支持事件冒泡）
  attachEvent()和detachEvent()
  接受两个参数：要处理的事件名称、作为事件处理程序函数
  id.attachEvent(“onclick”,oneFunction);

跨浏览器的事件处理程序

var eventUtil={
//添加句柄
    addHandler:function(element,type,handler){
//DOM2级
if(element.addEventListener){
        element.addEventListener(type,handler,false)
//IE
    }else if(element.attachEvent){
        element.attachEvent("on"+type,handler)
    }else{
//DOM0级
        element["on"+type]=handler;
    }
},
//移除函数
removeHandler:function(element,type,handler){
//DOM2级
if(element.removeEventListener){
        element.removeEventListener(type,handler,false)
//IE
    }else if(element.detachEvent){
        element.detachEvent("on"+type,handler)
    }else{
//DOM0级
        element["on"+type]=null;
        }
  }
}

调用上述事件方法
eventUtil.addHandler(but,"onclick",function);