jQuery load()方法内存泄漏? [英] jQuery load() method memory leak?

查看:254
本文介绍了jQuery load()方法内存泄漏?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经找到了解决这个问题的答案,虽然找到了相关的问题,但我找不到完全匹配的问题。

I have hunted around for answer to this one, and though have found related quesions, I couldn't quite find an exact match for this.

我有一个相当大的应用程序,它应该使用jQuery.load()方法将页面加载到另一个页面的div中。我遇到的问题是,当一遍又一遍地将同一页面加载到同一个div中时,我看到浏览器的内存大幅增加(内存泄漏)。如果我打电话给$(*)。取消绑定,我当然看不到泄漏,但是一切都已经重置,所以这不是真正的解决方法。以下代码示例重现此问题:

I have a fairly large app which is supposed to load pages into divs in another page using the jQuery.load() method. The problem I have is that when loading the same page over and over again into the same div, I see the memory of the browser increase substantially (memory leak). If I call $("*").unbind, I of course do not see a leak, but then everything has been reset, so this isn't reallya fix. The following code example reproduces this problem:

Test1.htm

Test1.htm

<head>
   <title></title>
    <script type="text/javascript" language="javascript" src="Scripts/jquery-1.3.2.js"></script>
        <script type="text/javascript" language="javascript">
        <!--
            var i = 0;
        $(document).ready(function() {
            $("#btn").click(
                function() {
                    i++;
                    $("#Test1").load("Test2.htm", null, function() {
                        //$(document).trigger("test");
                    })
                    $("#count").html(i);
                });
        });
    //-->
    </script>
</head>
<body>
    <img id="btn" src="someimage.png" />
    <h3>We are loading Test2.htm into below div</h3>
    <div>
        Count loads =<span id="count">0</span>
    </div>
    <div id="Test1" style="border-style:solid">EMPTY</div>
</body>

Test2.htm =任何旧的html页面..

Test2.htm = any old html page..

如果加载Test1.htm并单击按钮多次,您会注意到浏览器内存不断增加。我相信问题是加载的js和DOM元素永远不会被设置为垃圾收集。在我的真实世界系统中,我尝试删除(elem.remove()或.empty())已加载的元素,但这并不能解决问题。我也有很多使用src加载的js文件,我用$ .getScript替换,这似乎已经有了一些小改进。这些都是想到的解决方法,我想找到解决这个问题的真正解决方案。任何想法?

If you load Test1.htm and click the button mutliple times, you'll notice the browser memory steadily increasing. I believe the problem is that the loaded js and DOM elements are never set for garbage collection. In my real world system I have tried removing (elem.remove() or .empty()) the loaded elements, but this doens't really fix the problem. I also have many js files loaded using "src", which I replaced with $.getScript, this seems to have had made a small improvement. These are all workarounds thought, and I wanted to find a real solution for this problem. Any ideas?

推荐答案

编辑:由于提供了有关test2.htm(正在加载的页面)的更多信息而更新

update due to more info provided about test2.htm (the page being loaded)

原始答案(出于历史目的):我实际上看不到您提供的代码/标记中的任何泄漏 - 是否可能泄漏在Test2.htm中(您没有提供代码/标记)?

新答案:

我建议它可能是由于多次加载jQuery,或者你在test2.htm中有其他脚本。

I would suggest that it it probably due to either multiple loads of jQuery, or other scripts you have in test2.htm.

假设jQuery做了通过简单地实例化然后使 jQuery $ 无效,不会泄漏,多次加载将保留至少2个jQuery副本记忆。加载后,jQuery会在 _ $中备份任何以前版本的 $ jQuery _jQuery - 所以当你多次使用load()时,你将至少加载2个jQuery副本。

Assuming jQuery does not leak by simply instantiating and then nullifying jQuery and $, loading multiple times will keep at least 2 copies of jQuery in memory. When loaded, jQuery keeps a backup of any previous versions of $ and jQuery in _$ and _jQuery - so you are going to have at least 2 copies of jQuery loaded when you use load() multiple times.

上面的假设很可能正确 - 但即使你通过设置卸载它,jQuery也有可能泄漏$ jQuery _ $ _jQuery null - 它并不是真的打算多次加载(但是我确信它们是故意允许的,所以你可以使用 noConflict()如果需要加载和使用两个不同版本的jQuery。)

The above assumption is most likely not correct however - there is every chance that jQuery has leaks even if you "unload" it by setting $,jQuery,_$ and _jQuery to null - it's not really intended to be loaded multiple times like that (however I'm sure that they allow it intentionally, so you can use noConflict() to load and use two different versions of jQuery if necessary).

你可以添加一个选择器到一个加载网址。例如:

You can add a "selector" to a load URL. For example:

$("#Test1").load("Test2.htm body", null, function() { 
  //callback does nothing
});
//or
$("#Test1").load("Test2.htm div#the_Div_I_Want", null, function() { 
  //callback does nothing
});

如果您对ajax结果中的任何脚本不感兴趣,或者如果您对此感兴趣,我建议您这样做你想要脚本,你需要选择一个选择器来禁用某些元素/脚本,例如

I would suggest doing this if you are not interested in any scripts in the ajax result, or alternatively if you do want scripts, you'd need to choose a selector to disable only certain elements/scripts, e.g.

/* load with selector "all elements except scripts whose
   src attribute ends in 'jquery.js'" */
$("#Test1").load("Test2.htm :not(script[src$='jquery.js'])", null, function() { 
  //callback does nothing
});

另外值得注意的是,如果省略数据参数(你将其作为 null ),并提供一个函数作为第二个参数,jQuery将正确地确定第二个参数是回调,所以

Also of note is that if you leave out the "data" argument (you have it as null), and provide a function as the second argument, jQuery will correctly determine that the second argument is the callback, so

$("#Test1").load("Test2.htm :not(script[src$='jquery.js'])", function() { 
  //callback does nothing
});

是可以接受的

这篇关于jQuery load()方法内存泄漏?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆