JavaScript开发人员被鼓励使用新的、基于规范的事件模型,即DOM LEVEL 2的事件模型。但是这种模型又分为W3C和微软两种模型。

老事件模型和新的DOM LEVEL 2事件模型之间,最主要的区别在于:

新事件模型并不依赖于特定的事件来处理属性;

你可以对任何一个对象的任何一种事件注册多个事件句柄函数。

用来代替事件句柄属性的是每个对象提供的3个方法:addEventListener、removeEventListener、dispatchEvent。

微软的是:attachEvent和detachEvent

对于微软模型,一个要考虑的因素是它会为每个事件句柄留出响应的内存,即使你刷新页面,也会为每次连续的页面载入留出相应的内容,这样一会儿就会消耗大量的内存。为了避免使用过多的内存,你需要跟踪window的unload事件,然后调用detachEvent方法来清理每个事件。这将使内存管理系统在页面卸载时释放相应的内存空间。

例:

   
   
   
   
  1. function clickMe(evnt){ 
  2.     ... 
  3.  
  4. window.onload = setup; 
  5. window.onunload = cleanup; 
  6. function setup(evnt){ 
  7.     var evtObject = document.getElementById('clickme'); 
  8.  
  9.     //检查对象模型 
  10.     if(evtObject.addEventListener){ 
  11.         document.addEventLietener("click",clickMe,false); 
  12.     }else if(evtObject.attachEvent){ 
  13.         evtObject.attachEvent("onclick",cliceMe); 
  14.     }else if(evtObject){ 
  15.         evtObject.onclick = clickMe; 
  16.     } 
  17.  
  18. //清理 
  19. function cleanup(){ 
  20.     var evtObject = document.getElementById("clickme"); 
  21.     if(evtObject.detachEvent){ 
  22.         evtObject.detachEvent("onclick",clickMe); 
  23.     } 

上例中,为window.onunload事件句柄指定了一个名为celanup的函数,就是用来完成这一工作。不过window的onunload事件中addEventListener方法使用的内存是无须清理的。