灵活使用js事件代码，减少页面内存消耗

js事件代理简单得来说，就是通过js事件的event.target对象来判断你要操作的对象，这样你就不必在每一个元素都绑定事件处理程序，有效地减少了内存的消耗，循环的操作，好处多多。

比如一个弹出菜单，原来的做法是每一个按钮都注册一个onmouseover事件，现在你可以把事件注册到按钮的上层节点上来监听，通过判断发生事件的节点来进行一些列操作。 代码可能如下：

$('new-menu').addEvent('mouseover'，function(){ //绑定到new-menu这个节点上

    if(event.target.tagName == 'STRONG'){  //判断是不是你要的那个对象
var tab = $(event.target);    
var menuc = $(event.target).getNext();
event.stop();
    }
}); //代码基于mootools框架


如果一个页面有10多个弹出菜单，5个tab切换，每个切换有3个tab页，使用事件代理就得到的好处就是减少了76%的事件处理函数，页面对于内存的占用应该会有所提升，所以我还是喜欢使用事件代理。

当然事件代理也不是万能的，比如一些接口事件是不支持这个方法的，这里有一篇文章，可以参考下：http://cssrainbow.cn/index.php/code-snippets/javascript-code-snippets/1058.html

IE和firefox 事件Event中clientX 的2px之差

今天在做一个js效果，需要获得事件的鼠标坐标，遂考虑使用clientX，由于使用了mootools框架，以为都给格式化了。但是不管x，还是y，ie和firefox始终相差2px。于是google了一下，似乎答案很少，难道别的前端都不做这事？原来ie真的很傻，它就是从（2，2）开始的，必须减去document.documentElement.clientLeft 和document.body.clientLeft。

在标准模式（standards mode）下，clientX 是从 0 开始计算的，而在差异模式下（quirks mode，有没有更好的翻译？），是从2 开始的，但奇怪的是，测试两种模式都是从2,2 开始的。
实际上，这个值是分别存在于 document.documentElement.clientLeft 和 document.body.clientLeft 。在 standards mode 下面，document.documentElement.clientLeft 值为 2，document.body.clientLeft 为 0 。
在 quirks mode 下面正好相反 document.documentElement.clientLeft 为 0 ，document.body.clientLeft 值为2 。

x=event.clientX-document.documentElement.clientLeft - document.body.clientLeft ;
y=event.clientY-document.documentElement.clientTop - document.body.clientTop ;

转 http://bolm.cn/blog/?p=31

只要这样做event的2px之差就给修正了，可恶的IE。