addEventListener vs onclick

Question

addEventListener vs onclickaddEventListener和之间有什么区别onclick？var h = document.getElementById("a");h.onclick = dothing1;h.addEventListener("click", dothing2);上面的代码一起存在于一个单独的.js文件中，它们都完美地工作。

Answer 1

如果您有另外两个功能，您可以看到差异：

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之前的Internet Explorer中不起作用。您可以在IE <9中使用类似的attachEvent（语法略有不同）。