jQuery的live()函数的性能损失
对于某些元素，每当在它们上方盘旋时，我希望元素变得更大，然后在不悬停时收缩。所以我只使用$('.elementClass').hover(function() { enlarge(this); }, function() { shrink(this); });。我把它放在所有网页的$(function() { });区域，因为很多网页都有这类元素。
有时，我需要创建新的动态元素，它们在上面有这些元素。当然，我必须再次调用上面的悬停函数，因为它们一开始并不存在。
看起来最方便的是，在每个网页上都有一个完整的$('.variousClasses').live('variousEvents', function() { });调用，所有可能的功能，如上面所示。
所以问题是，即使在那些永远不会触发那些事件或永远不存在的元素上，调用live()这么多次也会有性能损失吗？在需要时只调用hover()或live('hover') (和其他事件)只调用是否重要？
回答 1
Stack Overflow用户
发布于 2011-09-12 06:28:31
作为对您问题的一般回答，您应该尽量减少无关的函数调用--在动态内容情况下可能会更多。
特别是，live()是这个问题的一个很好的例子，因为它确实带来了一些(潜在的)显著的性能复杂性。当您调用live()时，jQuery将您选择的事件绑定到document对象。这意味着每次事件被触发时，它都会从源元素中冒泡到document对象。根据您的站点结构(一般情况下)，这可能是昂贵的。
使用delegate()的更好的选择
最好使用jQuery的delegate()函数，特别是如果您有一个预定义的父容器元素，所有的事件都会在其中触发。当您使用delegate()时，基本上使用的是受限制的live()版本，这样事件只会传播到指定的父元素。因此，您可以避免在您不关心的元素上引发许多可能代价高昂的事件。
在您的示例中，由于您正在处理动态生成的内容，所以您必须使用上述函数或设置代码，以便在元素插入DOM时，它还将事件处理程序绑定到DOM中。前者可能更容易，但后者可以提供更好的性能(可能是看不见的)。
https://stackoverflow.com/questions/7382609
复制相似问题
腾讯云开发者
