为什么现在有更多人使用脚本来分配事件处理程序vs从html元素中分配事件？

Question

作为一个学习者,我喜欢看很多源代码.自从我在一年前开始学习JavaScript以来,我注意到人们不使用传统事件处理程序的趋势onclick="doSomething()",但是越来越多地使用像document.getElementById("someId").onclick = function(){..some code..};

这种趋势背后的原因是什么？

Answer 1

在Javascript中分配处理程序会将所有代码放在一个位置,而不是将其分散到整个HTML中.
这有助于将内容与脚本分开,就像CSS有助于将内容与样式分开一样.

它也更快,因为浏览器不需要为每个处理程序属性启动Javascript解析器.

这是Unobtrusive Javascript的一个例子.

Answer 2

其他答案没有涉及到这个,所以:

您的示例onclick甚至在JavaScript代码中使用(反射)属性:

document.getElemenbyId("someId").onclick = function(){..some code..};

...对我来说,没有使用属性而忽略了这样做的主要原因之一:和别人玩得很好.DOM2附加处理程序的方式(addEventListener或者attachEvent在IE [IE9上addEventListener最终有标准]):

document.getElementById("someId").addEventListener("click", function() { ... }, false);
// or
document.getElementById("someId").attachEvent("onclick", function() { ... });

... 是非独占的  - 可以同时附加多个处理程序.然而,如果您分配给onclick,那么您将踢掉任何先前的处理程序并接管.

对我来说,这个"玩得很好"的东西是一个很大的卖点.好吧,那并保持代码和标记分开,但在其他答案中已经很好地涵盖了.