使用 $(document).on( 'click', ,,) 的任何缺点答案

【问题标题】：Any disadvantage of using $(document).on( 'click', ,,)使用 $(document).on( 'click', ,,) 的任何缺点
【发布时间】：2015-08-11 10:54:45
【问题描述】：

使用$(document).on('click',...,function) EDIT: [我的意思是 $(document).on('click', #xyz ,function)]over$('#xyz').click(function)` ?

特别是我发现它在我必须使用带有控件的部分视图的页面中非常有用。即使在部分视图存在之前，我也会将 $(document).on ()'s 与 document.ready 一起调用，当我获得部分视图时，我不必重新连接事件。

但是我想知道这种方法有什么缺点吗？

谢谢

【问题讨论】：

单击文档上的任意位置将调用该函数，而 $(#) 将针对特定元素

标签： javascript jquery performance dom

【解决方案1】：

是的。

如果您将事件处理程序添加到document，它将必须处理所有事件，即使是您不想处理的事件。

而不是document，在委派事件时总是使用离目标最近的容器。

【讨论】：

【解决方案2】：

不同之处在于事件冒泡。从性能的角度来看，前者在需要绑定大量元素的情况下要好得多。

<ul id="list">
  <li></li>
  <li></li>
  ... a thousand more <li>'s
  </ul>

在这种情况下 $('#list').on('click', 'li', function() { }); 会比 $('li').click(function() { }); 好得多。这是 1 个事件与 100 万和 2 个事件之间的差异。我还建议不要将这些元素绑定到文档，除非您别无选择。最快的选择器将绑定到一个 ID。

【讨论】：

【解决方案3】：

$(document).on('click',...,function )

会在整个文档上注册一个点击事件，所以点击页面上的任何地方都会触发它。

$('#xyz').click(function)

将仅在 id=xyz 的元素上注册触发器

【讨论】：