Question

可能重复：
  JavaScript Event Listeners vs Event Handlers
  element.onload vs element.addEventListener(“load”,callbak,false)

我看过this question，但目前还不清楚

之间的区别

<input type="button" onclick="call_function();" />

和

$(function() {
    $("#my_button").click(function() {
        call_function();
    });
});
<input type="button" id="my_button" />

第一个是事件处理程序，第二个是事件监听器，我是对吗？

一种方式比另一种更好，为什么？哪一个更擅长处理优雅退化？

Answer 1

从功能上讲，没有区别。在这两种情况下，单击给定的call_function元素时都会调用方法button。

风格虽然存在很大差异。后一个例子被许多人认为更加健壮，因为它允许开发人员将HTML页面的3个部分分成完全不同的项目

HTML页面：包含页面数据
CSS样式表：确定数据的显示方式
Javascript：提供行为

这在第二个示例中是可行的，因为javascript行为是独立于按钮的定义而连接的。这允许完全独立于关联的javascript定义HTML。它们可以在单独的文件中，由不同的人编写，并且大部分是独立变异的。有一些限制（比如不要更改id字段）但总的来说它在显示的逻辑上不同的部分之间提供了很大的自由度。

Answer 2

事件处理程序是浏览器响应特定事件而调用的函数或其他代码块。

在给定的上下文中，事件监听器是由javascript库（jquery here）引入的更高级别的抽象，这个库将为你做的是创建事件处理程序，它将调用一些代码，这些代码将通过监听器并将其称为一个一个人。所以jquery隐藏了维护一个监听器函数列表并调用它们的逻辑。

事件监听器与事件处理程序

2 个答案: