javascript - Javascript事件处理历史记录

Question

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center提供指导。




7年前关闭。




虽然我确实了解Javascript事件处理的细节，但我想了解其背后的完整历史记录，例如事件处理的实际实现方式(可能在 <a onClick="callFunc()">这样的标记中使用它)

以及后来如何更新为其他方式，例如从JS(不引人注目的JS)调用它

现在如何使用jQuery实现？

我只是想了解每个阶段的优势以及事件冒泡/捕获等问题

最佳答案

好吧，这没什么。或者，实际上，任何事情都是很久以前发生的。
.addEventListener的历史与CSS差不多。
这就是DOM-Level2与我们在一起的时间(我认为大约13年)。

这不是关于JS如何变得更高级的问题，而是关于JS编写者不的问题。

我知道，将JS编写为“次要”或“大专”角色的程序员仍然使用内联处理程序。
至今已有十多年了，因为那是一个特别好的主意。

至于“不打扰”，这不一定与事件监听器直接相关。
就是说，如果您打算以任何方式与用户进行交互，但这更多的是分离关注点的问题，就像我们不再为<p><font color=red>red text</font></p>这样的元素设置样式一样。

DOM-0事件处理程序(如button.onclick = function () {})徘徊了这么长时间，并且仍然看到非常频繁的使用的部分原因可能是由于Microsoft的attachEvent和W3C的addEventListener之间的 war 。

如果要在IE6-8中支持跨浏览器事件，则可以使用jQuery(或其他库)，您可以手动编写事件管理功能，以支持IE的.attachEvent和其他所有人的.addEventListener。您直接使用事件属性(.onclick = function () {})。它们的好处是得到当今使用的几乎每个浏览器的支持。
它们的缺点是只有一个可分配的功能(如果您需要添加更多的功能，则会导致处理不便):

(function () {
    var button = document.getElementById("button"),
        old_func = button.onclick;

    button.onclick = function (e) {
        e = e || window.event;
        doStuff();
        if (old_func) { old_func(); }
    }
}());

...现在想象有8位不同的程序员以这种方式将侦听器添加到同一按钮。

至于冒泡还是捕获...
这从来不是一场真正的战斗(后Netscape)。
Microsoft支持的冒泡，W3C都支持。没有人真正使用捕获来做任何事情，因为在事件真正发生之前，甚至在目标甚至不知道它发生之前，您很少想知道某个事件(并且使用捕获的唯一方法是使用addEventListener，这意味着您的 Activity 将无法在IE上运行...)

jQuery带给桌面的不是"new"事件或“更好”事件，而是允许所有人对跨浏览器事件进行编程的行为。
许多AJAX库的主要目标是:标准化 addEventListener和 attachEvent之间的差异(这是在jQuery之前已解决的问题)，以及 XMLHttpRequest和 ActiveXObject("MSXML2.XMLHTTP.6.0")之间的差异(同样是在jQuery之前已解决的)。

jQuery一直是最受欢迎的，Resig做了一些不错的事情(而jQuery用户却用它做了一些可怕的事情，这迫使Resig和 friend 变得超人类，无法进行防白痴的DOM遍历和事件委托(delegate)。其余的)。

在过去的6年中，我们中的一些人在事件委托(delegate)方面变得更好，诸如Douglas Crockford和Nicholas Zakas这样的人掌管了社交 Realm ，撰写了有关专业，高水平，性能JS。

在过去的几年中，越来越多的人进入了设计模式，这种模式在其他可用于企业用途的语言中也可以看到。

当谈论Web应用程序的客户端异步编程时，诸如promise / deferreds / futures( $.Deferred / $.when)之类的东西是JS工程的 future 。

并不是说它看起来会像今天一样100％，而是说保持DOM事件直达是一个已解决的问题-使其与随时可能发生的所有异步事件保持一致，在页面上的任何小部件中...
...这就是“ promise ”派上用场的地方。

然后，您将拥有主持人/观察员，以确保模块间通信的安全和相互隔离。
这些可能是“自定义事件”，也可能是“发射器”……或“发布者/订阅者”。
您可以听并采取行动的事物。
它们可能是由实际的浏览器事件触发的，也可能是由代码触发的。

同样，jQuery并未发明或完善这一功能，但是您在jQuery中订阅的任何事件都是在做这些事情之一。

与 $.ajax相同-它不是真正使用DOM事件，而是传递Promises，您可以订阅。它使用的唯一DOM事件是实际从服务器检索数据的事件。在那之后，这都是自定义的。

在过去的几年中，我们在JS可以做什么以及我们如何处理交互和异步方面取得了长足的进步。

这几乎与 addEventListener如何变得更好，或者jQuery如何帮助我们弥合IE8和其他浏览器之间的鸿沟无关。

关于javascript - Javascript事件处理历史记录，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14931727/

上一篇：html - 在另一个 DIV 中 float 一个 DIV

下一篇：html - 为什么 CSS transform,translate 会改变旋转元素的旋转？

相关文章：

html - 如何判断元素在CSS中是否等距？

javascript - 如何在所有 HTML 页面中一次性弹出？

javascript - 未知的正则化器 : L2 in tensorflowjs

javascript - 如何构建一个包含许多脚本且 HTML 中只有一个脚本标签的 Angular 应用程序？

javascript - 使用或不使用 jQuery 获取屏幕上的 float div 位置

java - Css 未在速度模板(JAVA)中呈现

javascript - 两个数字的总和以及它们之间的数字

javascript - 动态表完全加载后调用 JS 函数

php - 修复 jQuery 即时搜索脚本选项卡

javascript - 对 Bootstrap 表中的可见行和相关隐藏行进行排序

Answer 1

好吧，这没什么。或者，实际上，任何事情都是很久以前发生的。
.addEventListener的历史与CSS差不多。
这就是DOM-Level2与我们在一起的时间(我认为大约13年)。

这不是关于JS如何变得更高级的问题，而是关于JS编写者不的问题。

我知道，将JS编写为“次要”或“大专”角色的程序员仍然使用内联处理程序。
至今已有十多年了，因为那是一个特别好的主意。

至于“不打扰”，这不一定与事件监听器直接相关。
就是说，如果您打算以任何方式与用户进行交互，但这更多的是分离关注点的问题，就像我们不再为<p><font color=red>red text</font></p>这样的元素设置样式一样。

DOM-0事件处理程序(如button.onclick = function () {})徘徊了这么长时间，并且仍然看到非常频繁的使用的部分原因可能是由于Microsoft的attachEvent和W3C的addEventListener之间的 war 。

如果要在IE6-8中支持跨浏览器事件，则可以使用jQuery(或其他库)，您可以手动编写事件管理功能，以支持IE的.attachEvent和其他所有人的.addEventListener。您直接使用事件属性(.onclick = function () {})。它们的好处是得到当今使用的几乎每个浏览器的支持。
它们的缺点是只有一个可分配的功能(如果您需要添加更多的功能，则会导致处理不便):

(function () {
    var button = document.getElementById("button"),
        old_func = button.onclick;

    button.onclick = function (e) {
        e = e || window.event;
        doStuff();
        if (old_func) { old_func(); }
    }
}());

...现在想象有8位不同的程序员以这种方式将侦听器添加到同一按钮。

至于冒泡还是捕获...
这从来不是一场真正的战斗(后Netscape)。
Microsoft支持的冒泡，W3C都支持。没有人真正使用捕获来做任何事情，因为在事件真正发生之前，甚至在目标甚至不知道它发生之前，您很少想知道某个事件(并且使用捕获的唯一方法是使用addEventListener，这意味着您的 Activity 将无法在IE上运行...)

jQuery带给桌面的不是"new"事件或“更好”事件，而是允许所有人对跨浏览器事件进行编程的行为。
许多AJAX库的主要目标是:标准化 addEventListener和 attachEvent之间的差异(这是在jQuery之前已解决的问题)，以及 XMLHttpRequest和 ActiveXObject("MSXML2.XMLHTTP.6.0")之间的差异(同样是在jQuery之前已解决的)。

jQuery一直是最受欢迎的，Resig做了一些不错的事情(而jQuery用户却用它做了一些可怕的事情，这迫使Resig和 friend 变得超人类，无法进行防白痴的DOM遍历和事件委托(delegate)。其余的)。

在过去的6年中，我们中的一些人在事件委托(delegate)方面变得更好，诸如Douglas Crockford和Nicholas Zakas这样的人掌管了社交 Realm ，撰写了有关专业，高水平，性能JS。

在过去的几年中，越来越多的人进入了设计模式，这种模式在其他可用于企业用途的语言中也可以看到。

当谈论Web应用程序的客户端异步编程时，诸如promise / deferreds / futures( $.Deferred / $.when)之类的东西是JS工程的 future 。

并不是说它看起来会像今天一样100％，而是说保持DOM事件直达是一个已解决的问题-使其与随时可能发生的所有异步事件保持一致，在页面上的任何小部件中...
...这就是“ promise ”派上用场的地方。

然后，您将拥有主持人/观察员，以确保模块间通信的安全和相互隔离。
这些可能是“自定义事件”，也可能是“发射器”……或“发布者/订阅者”。
您可以听并采取行动的事物。
它们可能是由实际的浏览器事件触发的，也可能是由代码触发的。

同样，jQuery并未发明或完善这一功能，但是您在jQuery中订阅的任何事件都是在做这些事情之一。

与 $.ajax相同-它不是真正使用DOM事件，而是传递Promises，您可以订阅。它使用的唯一DOM事件是实际从服务器检索数据的事件。在那之后，这都是自定义的。

在过去的几年中，我们在JS可以做什么以及我们如何处理交互和异步方面取得了长足的进步。

这几乎与 addEventListener如何变得更好，或者jQuery如何帮助我们弥合IE8和其他浏览器之间的鸿沟无关。