將單擊事件綁定到文檔比將其綁定到body更好嗎？

問題是簡單地將單擊事件綁定到文檔比將其綁定到body更好嗎？

之間

$("body").click(function(e){}); VS $(document).click(function(e){});

這是更有效的或可取？還是取決於情況？

老實說，我已經可以互換使用它們，並沒有看到任何區別，直到我好奇，並在這裏問這個問題。

來源

2011-03-07 lock

如果頁面高度小於視口高度，則單擊頁面下方的視口將不會觸發'body'單擊處理程序，但只觸發document單擊處理程序。

現場演示：http://jsfiddle.net/simevidas/ZVgDC/

在演示中，嘗試點擊文字下方的區域，你會看到只有document點擊處理程序執行。

因此，最好將處理程序綁定到Document對象。

來源

2011-03-07 02:23:58

+1。做得好。 – 2011-03-07 12:45:21

感謝您提供了一個非常豐富和直觀的答案 – lock 2011-03-08 07:22:20

嗨，看到這個請''jsfiddle.net/ZVgDC/11 /'，它只適用於鉻，我試過它在Firefox 15.0.1，和IE，它是沒有對他們工作..請給我一個解決方案。>>我的要求是，添加一個偵聽器到文檔，並且當用戶單擊任何其他對象然後div時，我想隱藏一個div ..所以如果上面的東西工作所有的瀏覽器，我的問題將得到解決。請在這裏看到@ŠimeVidas – Patriks 2012-09-29 09:08:33

將它綁定到document似乎是標準做法，所以我會堅持這一點。

document也是much faster。

來源

2011-03-07 02:16:53 alex

+1爲文檔解釋爲什麼它更快的 – lock 2011-03-08 07:23:53

@alex是這種比較文檔和document.body使用'on（）'事件委託的準確方法？ http://jsperf.com/jquery-document-vs-document-body-on-event-delegation因爲如果我使用'body'和'document.body'，我會得到不同的結果。 – 2013-06-08 11:25:51

@alex我認爲document.body會更快，因爲它更接近節點，但這似乎並非如此，你能解釋一下嗎？ – 2013-06-08 11:33:45

我會說，最好將事件綁定到文檔，因爲在某些情況下，某些瀏覽器正文可能會丟失。

來源

2011-03-07 02:17:07

我更喜歡將綁定事件處理程序綁定到文檔，因爲您可以在文檔準備好之前完成它，我喜歡儘可能多地做前面的事情。這在單頁面應用程序中也特別好，在這些應用程序中，主體可能會完全更改。 – dkubb 2014-07-03 18:29:06

我把這和DOM中的其他東西類似。

如果我綁定到<table>那麼它的級別比它內部的<tr>高。如果我綁定到<tr>那麼它低於<table>。這對於文檔（更高）和<body>（更低）在我看來只是一個級別問題。

所以，如果你想確保你將點擊事件綁定到最高的元素，然後綁定到文檔。

來源

2011-03-07 02:20:02

此外，身體可能不會覆蓋整個可見窗口（一些瘋狂的風格造成的）！我不知道在這種情況下是否仍然會獲得點擊事件。所以最好將它綁定到document。

來源

2011-03-07 02:20:38 panzi

將單擊事件綁定到文檔比將其綁定到body更好嗎？

回答

相關問題