为什么要避免硬编码 注册事件... 再次老生常谈一下 事件注册的方式.

对于这个话题  以前我有写过 一篇 随笔  地址 是 ：

http://www.cnblogs.com/_franky/archive/2009/03/23/1420029.html

 

以前那篇没有说透彻的东西 今天详细的 说一说. 看 代码 :

 

<button id ="btn1" onclick="do something ....">按钮</button>

 

对于这个东西 以前说的更多的是 代码写入 html中 带来的可维护性的问题 以及 行为和结构 不分离  带来的缓存利用率的问题. 今天说点别的

 

如果 你看过上一篇的话 应该知道 onclick 被赋予了一个 函数  各个浏览器下 这个函数名字不同  但作用 都是一个 即 click事件发生时 会去回调该函数....

 

但是 你可能没注意的问题是  这个回调环境 他大概是这个样子的 :

var btn = document.getElementById('btn1');

btn.onclick = function(event){

　　with(document){

     　　with(this){

　　　　　　//你的代码在这里.....

　　　　　　dom something ....

　　　　}

　　}

} 

 

也就是说 这个函数的 执行环境 中的 作用域链对象 的顶端 被先后放置了 document 对象和 this . 也就是  btn 

所带来的问题 则是  你 的代码 中 用到的所有变量 他大概需要 先到 btn 中去 找  找不到  再去 document 上找  然后才去 global

所以  即使 你  的代码 是 window.....  这个效率也是让人痛苦的.   而最要命的问题 则在于  考虑如下代码...

 

btn.onclick = function(event){

　　var cookie = 1000;

　　with(document){

     　　with(this){

　　　　　　　alert(cookie);

　　　　}

　　}

} 

当btn.onclick 被回调时 你永远打印不到 1000 而只会得到 document.cookie  所以 一但 你硬编码环境中 的某个变量名 与 当前节点  或document 的成员 相同...则 可能会带来 一些意外惊喜... 所以 还是请 放弃硬编码 的时间注册吧...写 完全行为和结构 分离的 页面... 为了性能 也为了别人  更为了你自己.....