jQuery事件处理 – 绑定到文档或’body’元素？
当我们想要引用整个页面时，我注意到使用了$(document)和$('body') ，特别是在绑定事件时。
$(document).on('click', '.myElement', function);
和
$('body').on('click', '.myElement', function);
性能方面有什么不同？ 如果$(document)将事件绑定到整个HTML文档，为什么我们不使用$('body')来绑定事件，比如click ？
请注意，这个问题并不是指使用ready函数，而是使用.on()或.delegate()绑定。
性能方面有什么不同？
几乎肯定没有，或者更准确地说，没有任何可衡量的。 理论上$('body')必须在DOM中搜索body元素，但这会非常快。 此外，由于body是document的子元素，因此在document之前的纳秒内会触及它。
但是有一些区别：
如果你在head的脚本中使用$('body')并且没有延迟执行它（ ready等）， $('body')将找不到任何东西并且不会挂钩任何处理程序。 另一方面， $(document)会。
如果文档的主体没有填充视口，那么至少在某些浏览器上，您将获得document上的单击而不是body ：
$(document).on("click", function() { $("document
").appendTo(document.body); }); $('body').on("click", function() { $("body
").appendTo(document.body); });
body { border-bottom: 1px solid #060; }
The line marks the bottom of body. Click above and below the line to see where the click was caught. (Note the line will move as we append to body.)
$('body')以 html元素$(document)目标，而$(document)以整个html文档为目标。 这意味着如果你想在元素中引用某些内容，你需要从$(document)到达那里，因为这是一条直接路径。
出于您的目的，根据您向我们展示的内容，它们应该是等效的。
Body是document的孩子。 因此，事件将在它们被冒泡到document之前首先到达body 。
例如： http ： //jsfiddle.net/CoryDanielson/JhH9V/
它绝对不一样，因为虽然使用jQuery / JavaScript时你可以用它们完成你的工作，但是你不能通过css设置文档样式。 你的身体可以有一个指定的高度。 尝试为您的身体添加200px的高度和您选择的背景颜色（因此，您可以看到差异）。 然后为文档和正文添加绑定（两个事件的不同操作）。
这个实验可能适合你。
‘document’关键字只是包含整个HTML Document的对象的句柄。 另一方面在jQuery中，$（’body’）包含HTML文档的正文部分。 但实际上，你不会注意到它们之间的行为差异。
有关几个jQuery函数及其工作过程的任何进一步信息，请访问： jQuery函数