В чем разница между этими двумя функциями 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

Мне кажется, что обе функции пытаются сделать одно и то же: связать обработчики событий способом, который согласован для всех браузеров (то есть, более старые версии IE, которые не поддерживают .addEventListener()). Если .addEventListener() метод доступен, он используется, в противном случае он создает прокси-функцию, которая обеспечивает вызов функции обратного вызова с соответствующими значениями для this и объект события.

Разница только в el[fn] против el['e' + fn] при создании и последующей ссылке на свойство элемента:

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

fn параметр addEvent() должна быть ссылка на функцию, и не совсем точно, я не уверен, что произойдет, если вы используете ссылку на функцию в качестве имени свойства, но я бы предположил, что это по существу делает toString() на функцию и использует результат в качестве имени свойства. Так el['e' + fn] будет делать то же самое, но добавить 'e' к началу. Я не вижу, что "е" имеет какое-то особое значение.