将单击事件绑定到文档比将其绑定到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更好吗？

回答

相关问题