Question

作为评论中的一个问题，评论者写道（强调我的）：

...通过使用内联“onclick”，你正在做类似的事情，但它更难维护，更容易出问题。 JavaScript社区作为一个整体已经暂时离开了内联JavaScript。

这是指使用

将事件附加到HTML元素

$("#someID").click(function(){
    do something here...;
});

而不是

<a id="someID" onclick="someFunction();">

是否真的从旧学校的方式转变为内联声明事件，如果是这样，其中一个的好处是什么？

编辑我想包含对original question的引用可能会有所帮助。它询问是否为每个选项卡附加了不同的点击事件。 我的回答废话，我欠FallenRayne道歉=）。

Answer 1

是的，至少在社区的某些部分，不确定如何衡量它。

绝对的优势，在我的头顶：

从纯粹的数量来看，想一想：

<a onclick="someFunction();">
<a onclick="someFunction();">
<a onclick="someFunction();">
<a onclick="someFunction();">
<a onclick="someFunction();">

或一次：

$("a").click(someFunction);

您可以通过css选择器等对大多数框架执行此操作，一次处理多个元素。这意味着在服务器代码中，您只需分配ID和类，客户端更容易单独处理。调试也更容易，例如：在控制台中我可以$('a').unbind('click').click(...something new...);

另一个好处是性能。如果我可以将其拆分为一个单独的.js文件，由客户端缓存，那就是我不会每次都发送的更薄的网页和额外的数据。较小的网页=更快的负载。

这是另外一个例子，考虑它是多么简单，通过jQuery授予一些框架动作，但这看起来如何与内联事件一起使用？

$("li").hover(function() {
  $(this).children().slideToggle();
});

相比之下，这是一个巨大的数量的内联代码，即使你忽略了动画部分它也很混乱（想想mouseenter/mouseleave，而不是mouseover/mouseout ......前者， .hover()使用哪个更复杂）

Answer 2

最大的好处是内容（html）和行动/行为（javascript）的分离。这称为Unobtrusive javascript。保持这些分离使得更容易改变而不影响另一个。

Answer 3

是否真的有一种偏离旧学校宣传内联事件的方式

是的，当然，特别是随着jQuery，Prototype等JS框架的兴起，所有这些都鼓励以“新学校”的方式宣布活动。

如果是这样，其中一个的好处是什么？

主要原因之一是HTML结构和JavaScript编程智能（可以说做属于分离）之间的分离。它使标记更加清晰，更清晰，更易于维护，而所有编程逻辑都保存在单独的文件中，具有加载性能优势以及更好的可维护性 - 您拥有包含代码的适当库，而不是JS代码的片段到处都是。

Answer 4

使用内联声明，您只能分配一个事件处理程序，而您可以根据需要分配任意数量的代码。此外，如果您需要为多个元素分配相同的事件处理程序，使用javascript更容易，更短，并且您遵守DRY原则。