這兩個addEvent函數有什么區別？

Question

這是第一個：

function addEvent(el, type, fn){
    if(el.addEventListener){
        el.addEventListener(type, fn, false);
    }else{
        el[fn] = function(){
            fn.call(el, window.event);
        }
        el.attachEvent('on'+type, el[fn]);
    }
}

第二個：

function addEvent(el, type, fn){
    if(el.addEventListener){
        el.addEventListener(type, fn, false);
    }else{  
        el['e' + fn] = function(){
            fn.call(el, window.event);
        }
        el.attachEvent('on'+type, el['e'+fn]);
    }
}

第二個只是添加前綴，它的作用是什么？

Answer 1

在我看來，這兩個函數都試圖做相同的事情：以一種在瀏覽器之間一致的方式綁定事件處理程序（即，不支持.addEventListener()舊版IE版本）。 如果.addEventListener()方法可用，則使用該方法，否則它將創建一個代理函數，以確保使用與this事件對象和事件對象相應的值來調用回調函數。

在創建並稍后引用元素的屬性時，區別僅在於el[fn]與el['e' + fn] ：

    el[fn] = function(){
        fn.call(el, window.event);
    }

addEvent()的fn參數必須是一個函數引用，而且我不確定如果將函數引用用作屬性名稱會發生​​什么，但是我猜想它實質上會對函數執行toString()並使用結果作為屬性名稱。 所以el['e' + fn]會做同樣的事情，只是在開頭加上'e' 。 我看不到“ e”有任何特殊含義。