jQuery.remove()，分离 DOM 元素，但我仍然可以从代码中访问元素。如何避免泄漏？

Question

我知道，在具有大量 UI 元素且完全基于 Ajax 的应用程序中正确管理内存并不容易（在我的应用程序中，页面永远不会重新加载）。但我想了解以下行为：

我有一个根元素，一次必须附加一个子元素（认为它是根元素是应用程序容器，子元素是单个页面）。 每当我在子内容之间切换时，我都会使用 jQuery.remove() 删除以前的内容，但我看到内容实际上已从 DOM 中分离出来，但它仍保留在内存中。

1. 根目录和两个子内容（child1 和 child2）
2. 我从 child1 切换到 child2，要求我的应用管理器在附加 child2 之前删除 child1
3. child2 正在附加（我可以看到），但我仍然可以使用管理 child1 的代码中的 child1 元素

child1 代码（包含对 child1 DOM 的引用）：

function testaccess(){
   load_and_remove(child2);
   var child1DOM = get_this_dom();
}

---

child1DOM 仍然存在，我可以对其进行操作，就好像它仍然附加到 DOM 一样。

好的，我想 jQuery.remove() 和 GC 将无法释放内存，直到我有可以访问它的代码，但即使我不调用 get_this_dom()，即使在退出 testaccess( )，我看到FF内存没有减少...

我想知道当我退出child1时如何让GC释放所有内存。

Answer 1

在释放所有对它的引用之前，它不会从 DOM 中删除。

您应该尝试删除 JS DOM 和渲染 DOM 之间的所有循环引用 - 它们都有单独的垃圾收集器并且单独工作。因此，为什么标记和清除 JS 垃圾收集器无法捕获这些。

您可以尝试重新编写代码以打破循环引用：

var mything = something();
mything = null;

这里有几篇文章可能会有所帮助：

http://msdn.microsoft.com/en-us/library/Bb250448

http://www.javascriptkit.com/javatutors/closuresleak/index.shtml

http://javascript.info/tutorial/memory-leaks

我很确定您可以很快找到更多关于此的内容。

另外，您可以尝试 .empty() 释放所有子节点，但它调用 .remove() 来做一些工作。

请注意，其中一些问题已在较新版本的 jQuery 中得到修复，例如，1.5 优于 1.4。

另一个关于 SO 的帖子：jQuery memory leak with DOM removal