也可以通过对侦听器进行原型化(如果我们有对它的引用，而且它不是匿名函数)来扩展侦听器，或者使onclick调用成为对函数库的调用(函数调用其他函数)。

如:

elm.onclick = myFunctionList;
function myFunctionList(){
    myFunc1();
    myFunc2();
}

这意味着我们永远不需要改变onclick调用，只需要改变myFunctionList()函数来做任何我们想做的事情，但这让我们无法控制冒泡/捕获阶段，所以应该避免在新浏览器中使用。

虽然onclick可以在所有浏览器中工作，但addEventListener不能在旧版本的Internet Explorer中工作，后者使用attachEvent代替。

onclick的缺点是只能有一个事件处理程序，而其他两个将触发所有注册的回调。

如果你不太担心浏览器的支持，有一种方法可以在事件调用的函数中重新绑定'this'引用。它通常指向在函数执行时生成事件的元素，这并不总是您想要的。棘手的部分是同时能够删除相同的事件侦听器，如本例所示:http://jsfiddle.net/roenbaeck/vBYu3/

/*
    Testing that the function returned from bind is rereferenceable, 
    such that it can be added and removed as an event listener.
*/
function MyImportantCalloutToYou(message, otherMessage) {
    // the following is necessary as calling bind again does 
    // not return the same function, so instead we replace the 
    // original function with the one bound to this instance
    this.swap = this.swap.bind(this); 
    this.element = document.createElement('div');
    this.element.addEventListener('click', this.swap, false);
    document.body.appendChild(this.element);
}
MyImportantCalloutToYou.prototype = {
    element: null,
    swap: function() {
        // now this function can be properly removed 
        this.element.removeEventListener('click', this.swap, false);           
    }
}

上面的代码在Chrome上运行得很好，并且可能有一些关于“绑定”与其他浏览器兼容的问题。

一个细节还没有被注意到:现代桌面浏览器将不同的按钮按下视为AddEventListener的“单击”(默认为“单击”和“onclick”)。

在Chrome 42和IE11上，onclick和AddEventListener都单击左边的fire和中间的click。 在Firefox 38上，onclick只在左键点击时触发，但AddEventListener点击在左、中、右击时触发。

此外，当使用滚动游标时，中键点击行为在浏览器中非常不一致:

在Firefox上，中键单击事件总是会触发。 在Chrome浏览器上，如果中间点击打开或关闭滚动光标，它们不会触发。 在IE上，它们会在滚动光标关闭时触发，但不会在打开时触发。

同样值得注意的是，任何键盘可选择的HTML元素(如input)的“click”事件也会在元素被选中时触发空格或enter。

简介:

addEventListener可以添加多个事件，而onclick则不能这样做。 onclick可以作为HTML属性添加，而addEventListener只能添加在<script>元素中。 addEventListener可以接受第三个参数，该参数可以停止事件传播。

两者都可用于处理事件。然而，addEventListener应该是首选的选择，因为它可以做onclick做的所有事情，甚至更多。不要使用内联onclick作为HTML属性，因为这会混淆javascript和HTML，这是一个坏的做法。它使代码更难维护。

如果你有另外两个函数，你可以看到区别:

var h = document.getElementById('a');
h.onclick = doThing_1;
h.onclick = doThing_2;

h.addEventListener('click', doThing_3);
h.addEventListener('click', doThing_4);

函数2、3和4可以工作，但函数1不行。这是因为addEventListener不会覆盖现有的事件处理程序，而onclick会覆盖任何现有的onclick = fn事件处理程序。

当然，另一个重要的区别是onclick总是可以工作，而addEventListener在版本9之前的ie中不能工作。你可以在IE <9中使用类似的attachEvent(语法略有不同)。