在整個文檔上監聽事件的成本有多高？

Question

我想在HTML頁面上的多個按鈕上使用事件委託。這些按鈕遍佈整個頁面，我想知道在點擊事件中監聽整個文檔是多麼昂貴，然後讓點擊事件觸發事件委託處理程序。這是否比在20個以上的按鈕上放置聽衆更昂貴（它可以增長到超過100個按鈕，是的，這很愚蠢）？

Answer 1

我不明白它會如何更昂貴，因爲它將監聽文檔對象而不是25個錨點對象的點擊。就這樣說，只有25-30個按鈕並不是真正的資源密集型，所以你可能不需要擔心這一點。

Answer 2

這是jQuery「live」方法所使用的策略：對整個文檔進行偵聽，然後根據條件（即選擇器）測試發送方。除非選擇器的強度無法忍受，否則這種技術對於大型且不斷增長的目標組更爲有效。

Answer 3

你很難嗎？工作代碼不是很好的代碼。

如果在頁面中使用20〜40個按鈕偵聽器，而不是使用委託，那麼它將工作，並且可能您甚至不會看到任何性能問題。我想你會使用forin/$。each來綁定所有這些監聽器，所以你不需要爲每個監聽器編寫代碼。

所以，我的請求是請使用委託。

如果將來您需要更改邏輯或者您決定測試應用程序，那麼您將遇到麻煩。

Answer 4

我不明白怎麼會是更昂貴的，因爲它會聽的文檔對象，而不是25錨上點擊對象

這裏的關鍵思想是深度。您的事件在執行前必須遍歷DOM。如果您的元素深入DOM樹，您可能會注意到一些性能下降。

幾件事情要記住：

• 錨事件委派不要緊的數量，這是真的
• 一般來說事件代表團在大多數情況下一個更好的選擇，但它的沒有用所有的時間

我的建議是分析這些類型的問題，學到的東西是如何工作的，並通過良好的老常識作出決定。