JavaScript事件處理歷史

雖然我理解JavaScript事件中的點點滴滴處理，我想了解它背後的完整的歷史，像事件處理實際是如何實現（可能使用它像<a onClick="callFunc()">標記內）JavaScript事件處理歷史

以及它如何後來得到更新，像從JS調用它（不顯眼的JS）

它現在如何使用jQuery實現？

我只是想了解每個階段的優勢，以及諸如此類事件冒泡/捕獲等

2013-02-18 testndtv

您正在索要一篇小論文。我認爲你需要讓你的問題更加簡潔和專注，以便一個人可以在合理大小的答案中回答，以適應StackOverflow問答格式。除了好奇之外，你真的需要知道什麼具體的事情？ – jfriend00 2013-02-18 08:13:09

我只是想了解Javascript事件處理機制多年來發展的方式，特別是像jQuery這樣的框架如何改變事件處理的方式。它爲桌子帶來了哪些改進？ – testndtv 2013-02-18 08:15:51

[Quirksmode.org有很好的介紹]（http://quirksmode.org/js/introevents.html），涵蓋了大部分的問題。 – Bergi 2013-02-18 08:28:38

好了，沒有多少吧。或者，實際上，它發生的任何事情都是在很久以前發生的。

.addEventListener已經存在，只要CSS有。這就是DOM-Level2與我們在一起的時間（約13年，我認爲）。

這是不是JS如何得到更高級的一個問題，它的JS-作家沒怎麼的問題。

程序員我知道，誰寫JS作爲「二級」或「三級」角色仍然使用內聯處理程序。這已經超過十年了，因爲這是一個特別好的主意。

至於「不顯眼」，這不一定直接與事件監聽器相關。
就是說，如果你打算以任何方式與用戶進行交互，但它更多的是分離問題的問題，我們不再像<p><font color=red>red text</font></p>那樣設計元素。

的是DOM-0的事件處理程序（如button.onclick = function() {}）都掛着這麼久，仍然看得很頻繁使用的原因也許是一個組成部分，是因爲微軟的attachEvent和W3C的addEventListener之間的戰爭。

如果你想支持IE6-8跨瀏覽器的事件，你要麼使用jQuery（或其他圖書館），你手寫的事件管理功能，同時支持.attachEvent針對IE和.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）。
微軟支持泡泡，W3C同時支持。沒有人真的使用捕獲來捕獲任何東西，因爲在事件真正發生之前，甚至在目標知道它正在發生之前，你很少想知道事件（並且因爲使用捕獲的唯一方法是使用addEventListener，這意味着您的活動無法在IE上運行...）

什麼jQuery帶到桌子上不是「新」事件或「更好」的事件 - 它所做的事情是允許所有人編寫跨瀏覽器事件。
許多AJAX庫都將此作爲主要目標：在addEventListener和attachEvent（這是jQuery之前已解決的問題）之間，以及XMLHttpRequest和ActiveXObject("MSXML2.XMLHTTP.6.0")之間（再次解決的pre-jQuery）之間的差異歸一化。 jQuery剛剛贏得了衆人的喜愛，並且Resig用它做了一些很好的事情（當jQuery用戶用它做了一些可怕的事情時，迫使Resig和朋友成爲超人類的笨蛋證明DOM遍歷和事件授權等）。

過去6年來，我們中的一些人在事件授權等方面做得更好，因爲像道格拉斯克羅克福德和尼古拉斯扎卡斯這樣的人佔據了社會領域的統治地位，寫了很好的書籍和偉大的談話專業，高性能的JS。

在過去的幾年裏，越來越多的人進入了其他語言中看到的企業用設計模式。

類似承諾/延期/期貨（$.Deferred/$.when）的東西是JS工程的未來，當談論客戶端的Web應用程序的異步編程。

這並不是說它看起來像現在這樣100％，但它是說保持DOM事件的直接是一個解決的問題 - 保持它們與所有可能發生的異步事件一致在任何時候，在頁面上的任何插件...
...這就是Promise派上用場的地方。

然後你有主持人/觀察員保持模塊間的通信安全和解耦。
這些可能是「自定義事件」，或者可能是「發射器」......或「發佈者/訂閱者」。
您可以聆聽並採取行動的事物。
它們可能是由實際的瀏覽器事件觸發的，或者它們可能是由代碼觸發的。

同樣，jQuery沒有發明或完善這個，但是你在jQuery中訂閱的任何事件都是在這些背後做的。

與$.ajax相同 - 它並不真正使用DOM事件，它傳遞的是Promises，您可以訂閱它。它使用的唯一DOM事件是實際從服務器檢索數據的事件。之後，這都是習慣。

在過去的幾年中，我們在JS的功能，以及我們如何處理交互和異步性方面取得了巨大的飛躍。

這與之前addEventListener的改進有些關係，或者jQuery如何幫助我們彌合IE8和其他瀏覽器之間的差距。

來源

2013-02-18 08:48:05 Norguard

我仍然偶爾使用事件處理程序屬性，通常（但並非總是）原型時：它仍然是添加事件處理程序的最快方法。 – 2013-02-18 14:39:56

根據我的理解 1. Javascript與html的交互是通過events來處理的，它指明瞭什麼時候在瀏覽器窗口或文檔中出現特定時刻。這些事件可以由聽衆處理。 2.事件冒泡說 - 事件開始於事件被觸發並且向上流向文檔級別的位置。 ie-div-body-html-document。例如： 1。這裏的事件監聽器函數將有一個名爲event的本地默認對象。這將說明事件的類型。 2. 這裏說的是事件目標元素。

event.preventDefault（）方法停止發生元素的默認操作。

分類事件組：用戶交互事件/焦點事件/鼠標事件/滾輪事件/文本事件/鍵盤事件。這些事件會因移動設備而異。

來源

2013-02-18 09:19:45

JavaScript事件處理歷史

回答

相關問題