內嵌處理程序是如何處理的？

我懷疑內聯處理程序是evalled，但無法找到任何信息。出於好奇：那麼有人知道如何處理這樣的處理程序？爲了清楚起見，我的意思是在線處理程序，如：內嵌處理程序是如何處理的？

<a href="#" onclick="doSomethingReallyCunning()">...</a> 
<input type="checkbox" onmouseover="this.checked=!this.checked;this.blur()"/>

等

來源

2011-05-04 KooiInc

在哪個瀏覽器中？ – Quentin 2011-05-04 10:28:45

任何瀏覽器，我想？ – KooiInc 2011-05-04 10:29:40

我認爲這是之前問過的，但我找不到它。獲取屬性的內容並創建一個新的函數，該函數體和'event'作爲參數（至少在W3C兼容的瀏覽器中）。這是你想知道的嗎？還是更詳細？ – 2011-05-04 10:37:34

內部，內聯事件的屬性通過創建一個匿名包裝函數這樣的處理：

element.onclick = new Function("event", onclickAttribute); 
// etc.

這意味着內容的屬性是eval ed，但只有當元素插入到DOM中時（在此之後，函數在內存中以解析形式，就像其他事件處理程序一樣）。這意味着它不會比使用您自己的單獨JavaScript代碼分配的事件處理程序消耗更多的內存和時間。即使每次事件發生時都必須解析代碼，它不會產生如此大的差別，以至於用戶會注意到它。

但是，有一個很好的理由遠離使用內聯事件屬性：保持表示和邏輯彼此分離，從而提高可讀性和可維護性。另一個優點是使用縮小器不那麼痛苦，因爲JavaScript文件中的這些函數名稱可能會根據縮小器的設置和智能而發生變化，但不會在標記中發生變化（解決此問題的方法是在定義時使用方括號表示法這些函數在你的代碼中（如window['doSomethingReallyCunning'] = function (…) {…），所以函數名將保持不變;但是，如果有更好的函數，這當然不是一個簡潔的解決方案）。如果只通過直接引用函數在代碼中分配事件處理程序，則該函數名稱的所有實例都會更改（當然，參數setTimeout和setInterval的參數也是如此）。

來源

2011-05-05 11:21:12

感謝您的回答。我知道結構和邏輯（或結構和行爲）的分離，但最小化者的論點也是強大的。無論如何，函數名稱都可以在代碼中更改，所以如果您使用第三方腳本並從該內聯引用函數，則它是相同的參數。我多年來一直沒有使用內聯處理程序，但幾天前在一些SO問題之後對它的機制不安全。 – KooiInc 2011-05-05 11:55:20

@Kooilnc：如果我可以問哪一個？ – 2011-05-05 11:58:13

內嵌處理程序是如何處理的？

回答

相關問題