掉到坑里

版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明
http://fallenlord.blogbus.com/logs/8125653.html

javascript给web带来了丰富多彩的交互行为，在一系列交互行为的背后，有两个特性给予了javascript强大的支持，一是DOM文档对象模型，通过它javascript有可能对网页的内容进行修改，从而达到动态的效果；另外一个就是javascript的事件处理模型，可以这么说，事件模型是一切交互行为的源头，用户与网站交互产生行为事件，javascript为事件添加event handler来给用户反馈。
通常来说，javascript的事件模型有三种，它们分别是NN4、IE4+和W3C/Safari。
这三种事件模型有什么不同呢？
下面我们来举一个简单的例子，或许我们在看别人的一些js代码时常会看到这样的代码： 这是对事件响应对象的一种判断，由于三种事件模型存在着这样那样的差异，所以如果要做兼容性的开发，这种判断是必不可少的，在IE4+中，事件被直接赋予到一个window.event属性中，你可以直接使用；但是在基于标准的DOM事件模型中并不是这样，它是通过传参的方法来传播事件的，也就是说你需要为你的函数提供一个事件响应的接口，在上述函数中，evt扮演的就是这个角色。
当然事件响应的不同只是一个方面，三者在事件发生节点、事件属性等各个方面都有着或多或少的差异，下面这张表很好的总结了三者对于事件对象的不同解释：

Event target	target	srcElement	target
Event type	type	type	type
X coordinate on page	pageX	*	pageX
Y coordinate on page	pageY	*	pageY
Mouse button	which	button	button
Keyboard key	which	keyCode	keyCode

标注*的属性值可以通过对 event.clientX + document.body.scrollTop 或者 event.clientY + document.body.scrollTop 进行求值来得到。另外，在事件绑定方面，三者也有着不同的方法：
事件绑定方法I：绑定元素属性 把事件绑定到元素属性上有一个优点，即可以支持开发者把参数传递给事件处理器函数。接收事件的元素的引用则由一个特殊的参数值?this 关键字来传递。事件绑定方法II：绑定对象属性
对于 NN3+ 和 IE4+ 这两类浏览器，脚本编程人员可以以脚本语句的方式把事件绑定到对象上，而不是绑定到元素标识的属性上。每一个负责事件响应的元素对象都为自己能够识别的事件设置了相应的属性。对象属性名称是元素标识属性的小写形式，比如 onmouseover。
当您把一个函数的引用赋值给一个事件属性的时候，就发生了绑定。函数的引用是指函数的名称，但是不带函数定义中的括号。因此，如果要为一个名为 myButton 的按键的点击事件（click）进行绑定，使之激活一个定义为 myFunc() 的函数，则其赋值语句如下所示： 事件绑定方法III: 绑定 IE4+