微軟模型事件捕獲可能的內存問題

 JavaScript開發人員被鼓勵使用新的、基於規範的事件模型，即DOM LEVEL 2的事件模型。但是這種模型又分爲W3C和微軟兩種模型。

老事件模型和新的DOM LEVEL 2事件模型之間，最主要的區別在於：

新事件模型並不依賴於特定的事件來處理屬性；

你可以對任何一個對象的任何一種事件註冊多個事件句柄函數。

用來代替事件句柄屬性的是每個對象提供的3個方法：addEventListener、removeEventListener、dispatchEvent。

微軟的是：attachEvent和detachEvent

對於微軟模型，一個要考慮的因素是它會爲每個事件句柄留出響應的內存，即使你刷新頁面，也會爲每次連續的頁面載入留出相應的內容，這樣一會兒就會消耗大量的內存。爲了避免使用過多的內存，你需要跟蹤window的unload事件，然後調用detachEvent方法來清理每個事件。這將使內存管理系統在頁面卸載時釋放相應的內存空間。

例：

function clickMe(evnt){
    ...
}

window.onload = setup;
window.onunload = cleanup;
function setup(evnt){
    var evtObject = document.getElementById('clickme');

    //檢查對象模型
    if(evtObject.addEventListener){
        document.addEventLietener("click",clickMe,false);
    }else if(evtObject.attachEvent){
        evtObject.attachEvent("onclick",cliceMe);
    }else if(evtObject){
        evtObject.onclick = clickMe;
    }
}

//清理
function cleanup(){
    var evtObject = document.getElementById("clickme");
    if(evtObject.detachEvent){
        evtObject.detachEvent("onclick",clickMe);
    }
}

上例中，爲window.onunload事件句柄指定了一個名爲celanup的函數，就是用來完成這一工作。不過window的onunload事件中addEventListener方法使用的內存是無須清理的。