2011-10-12 58 views
0

我有一个关于如何处理对jQuery对象的引用的问题。jQuery:在应用程序运行时保持对jQuery对象的引用

假设在我的应用程序中,我有一个ID为some_widget的DOM元素DIV,它应该在所有应用程序运行时期间运行并且在代码中经常使用。

1),所以如果我在应用程序运行时保持对它的引用在一个全局变量:

var someWidget = $("#some_widget") 

它会创建的jQuery对象一次,但会消耗应用程序运行时的内存,但是当我使用someWidget它不会再次创建jquery对象,所以这可以加速这个过程。 2)如果我总是在代码中使用$(“#some_widget”)的调用,它不会不断消耗内存,但每次使用$。它需要时间jQuery来构造对象。

我对不对?什么方法更加充分? 可以保持对许多对象的引用最终与内存泄漏? 它取决于什么,你怎么看?

回答

2

是的,你可以通过在变量中声明它来缓存你的jQuery对象。事实上,这被认为是重用对象的最佳实践。

2

我的理解(尽管我自己仍然是jQuery新手)是通过缓存jQuery对象进行保存是因为每次调用选择器时都不会遍历DOM。因此,例如,如果您在代码中多次调用$("#some_widget"),那么jQuery将每次遍历DOM以查找具有该ID的元素。如果你在变量中缓存一次,那么你可以像调用选择器一样调用jQuery方法,但不需要DOM遍历。我已经在代码中实现了这一点,并且实现了性能改进。我没有意识到使用缓存方法的内存泄漏问题,并且我对该主题的大部分阅读建议将缓存作为最佳实践。

另一方面,如果你这样做会有帮助的是增加一个命名约定来缓存这种类型的变量。例如,前面加上一个$给变量:

var $someWidget = $("#some_widget"); 

有些人不喜欢,但我认为它是有用的时候视觉跟踪哪些变量我可以使用jQuery的功能。

+0

我是其中之一;额外的$使我很清楚,我正在处理缓存的jQuery对象。我一直使用它来使$这个变量(从$(this))。 –

1

是的,你是对的。唯一我想补充的是 var query_result = $("some_selector")实际上是将您的查询结果缓存到变量中供以后使用。如果查询的结果恰好是一个小部件,那么它将被缓存。显而易见的好处是,当你使用这个缓存查询时,jQuery不必再次查询DOM来为你创建结果。但缺点是,缓存的结果就像查询执行时的DOM快照。因此,如果在后期dom被操纵,执行$("previous_selector")将返回与缓存query_result不同的东西,这可能不是您所期望的。

不完全确定内存泄漏,已经看到很多程序员使用这种缓存技术,并且也被推荐。

+0

感谢您的重播。但是,你是什么意思“如果在稍后阶段dom被操纵,执行$(”previous_selector“)将返回不同的东西”,如果它的一个小部件可以返回什么不同?例? – WHITECOLOR

+0

你只是从小部件的角度来考虑它。 例如可以说你的DOM是这样的页面加载: '

  • Item 1
  • Item 2
'。现在你缓存了所有的列表项'var li_list = $(“。foo li”)'。现在你有2个“li”缓存在'li_list'中。 后来你操纵你DOM和它成为这样的: '
  • 项目1
  • 项目2
  • 项目3
  • ',如果你要再次运行查询“VAR new_list = $(“.foo li”)'变量'new_list'将会有3个元素,其中原来的'li_list'只有2个元素。 我希望这可以解释它。 – websymphony

    +0

    是的,如果“小部件”是一个jq对象的数组,它不会被动态更新。但是,如果只获取DOM元素作为窗口小部件(就像在我的示例DIV中)那样,您可能不会找到此对象的这种操作,从而导致您所描述的内容出现问题,不是吗? – WHITECOLOR

    相关问题