响应事件

添加事件处理器

function buttonAlert(){
    alert("You clicked the button");
}
document.getElementById("myButton").onclick = buttonAlert;

在注册事件处理器时，函数名后面不能有括号。

删除事件处理器

要删除事件处理器，只需要简单地给它赋值null：

document.getElementById("myButton").onclick = null;

event对象

跨浏览器的事件处理器

MyElement.onclick = function(e){
    if (!e) var e = window.event;
    //这样e就能代表任何浏览器的event对象
}

为了实现跨浏览器的代码，我们需要在脚本中检测event对象是否具有我们需要的方法和属性：

if (!e) var e = window.event;
var element = (e.target) ? e.target : e : e.srcElement;

W3C方式

W3C提供了addEventListener和removeEventListener方法

element.addEventListener("click", myFunction, falise);
element.removeEventListener("click", myOtherFunction, false);

第一个参数指明要捕获的事件，第二个参数指明时间要执行的函数。

微软方式

微软提供了两种类似的方法：attachEvent和detachEvent

element.attachEvent("onclick", myFunction);
element.detachEvent("onclick", myFunction);

跨浏览器的实现方式

function addEventHandler(element, eventType, handlerFunction) {
    if (element.addEventListener) {
        element.addEventListener (eventType, handlerFunction);
    } else if (element.attachEvent) {
        element.attachEvent ("on" + eventType, handlerFunction);
    }
}

鼠标点击

在W3C浏览器里，鼠标左键返回0，中键返回1，右键返回2。
在微软浏览器里，鼠标左键返回1，右键返回2，中键返回4。

document.onkeydown = function(e) {
    if (!e) var e = window.event;
    alert(e.keyCode + " is the code for " + String.fromCharCode(e.keyCode));
}