对于某些元素，当鼠标悬停在它们上面时，我希望元素变大，然后在取消悬停时缩小。所以我简单地使用$('.elementClass').hover(function() { enlarge(this); }, function() { shrink(this); });。我把它放在所有网页的$(function() { });区域，因为许多网页都有这种元素。
有时候我需要创建新的动态元素，它们上面就有这些元素，当然，我必须为它们再次调用上面的hover函数，因为它们一开始并不存在。
什么似乎是最方便的是简单地有一个完整的电池的$('.variousClasses').live('variousEvents', function() { });调用在每个网页的所有可能的功能，如上述。
因此，问题是，调用live()这么多次，即使是在永远不会触发那些事件的元素上，或者在永远不会存在的元素上，是否会有性能损失？我是否应该小心地只在需要的时候调用hover()或live('hover')（和其他事件）？
1条答案
按热度按时间ego6inou1#
作为对您问题的一般回答，您应该尝试最小化无关的函数调用--在动态内容的情况下可能更是如此。
特别是，
live()是一个很好的例子，因为它确实带有一些当您调用live()时，jQuery会将您选择的事件绑定到document对象，这意味着每次触发该事件时，它会从源元素冒泡到document对象。根据站点结构（一般情况下），这可能会很昂贵。delegate()是更好的替代方案最好使用jQuery的
delegate()函数，特别是如果您有一个预定义的父容器元素，所有事件都将在其中触发。当您使用delegate()时，您基本上使用了live()的受限版本，这样事件只传播到指定的父元素。因此，您可以避免在不关心的元素上引发许多可能代价高昂的事件。在您的示例中，由于您使用的是动态生成的内容，因此必须使用上述函数或设置代码，以便在将元素插入DOM时，还将事件处理程序绑定到该元素。前者可能更容易，但后者可能提供稍微好一点的性能（可能难以察觉）。