javascript 事件处理

js事件处理的方式有三种:

1.HTML事件处理

<input type="button" value="click me" onclick="alert("Clicked");"/>

2.DOM0级事件处理

var btn = document.getElementById("myBtn");
btn.onclick = function(){
  alert("Clicked");  
}

3.DOM2级事件处理

var btn=document.getElementById("myBtn");
btn.addEventListener("click",function()){
    alert(this.id);
},false);
//false 表示在冒泡阶段调用时间处理函数,如果是true,表示在捕获阶段调用事件处理程序。

4.IE事件处理

IE8及IE8以前的版本只支持事件冒泡。

var btn=document.getElementById("myBtn");
btn.attachEvent("onclick",function()){
    alert(this === windown); //true 跨浏览器编程时,要牢记这一区别。
},false);

5.跨浏览器的事件处理

var EventUtil = {
    addHandle:function(element, type, handler){
        if(element.addEventListener){
            element.addEventListener(type, handler, false);
        }else if(element.attachEvent){
            element.attachEvent("on"+type, handler);
        }else{
            element["on"+type] = handler;
        }
    },
    removeHandle:  function(element, type, handler){
        if(element.removeEventListener){
            element.removeEventListener(type, handler, false);
        }else if(element.detachEvent){
            element.detachEvent("on"+type, handler);
        }else{
            element["on"+type] = null;
        }
    }
}

 

posted @ 2015-01-11 20:33  山楂条子  阅读(166)  评论(0编辑  收藏  举报