10

在 javascript 中创建新的 Image 元素时，Google Chrome 的内存工具（开发者工具 > 时间线 > 内存）自然会将其视为新的 DOM 元素。

就我而言，我最终得到了 1500 多个 DOM 元素，我希望摆脱它们。当我准备好创建所有对象时，我试图将所有对象保存在一个数组中并在一个循环中删除它们，导致以下错误：

Uncaught TypeError: Cannot call method 'removeChild' of null

这表明 Image 对象没有出现在实际的 DOM 中。

var images = [];
var i, image;

for( i = 0; i < urls.length; i++ ) {
    image = new Image();
    image.src = urls[i];
}

// other stuff happens

for( i = 0; i < images.length; i++ ) {
    // apparently this doesn't work because I'm not adding the image to my DOM
    // images[i].parentNode.removeChild( images[i] );

    // delete images
}

有没有办法删除/删除/取消设置/处置图像对象？

4

5 回答 5

12

设置images = null将删除您在代码中对对象的引用。然而，为了实现它的load事件，Chrome 必须有它自己的对该对象的内部引用。

也就是说，你可以有这样的代码：

for( i = 0; i < urls.length; i++ ) { 
    image = new Image(); 
    image.src = urls[i]; 
    image.onload = function(){alert('Test');};
    image = null;
}

这样，即使您没有对这些对象的引用，您仍然会收到很多“测试”警报。

因此，我的猜测是它是 Chrome 中的错误，而不是您的代码中的错误。

更新：查看 Chromium 源代码证明了这一点（我的意思是对该文件第 67-71 行的评论，尤其是 FIXME 注释http://code.google.com/searchframe#OAMlx_jo-ck/src/third_party/WebKit /Source/WebCore/bindings/v8/custom/V8HTMLImageElementConstructor.cpp）：

// Make sure the document is added to the DOM Node map. Otherwise, the HTMLImageElement instance
// may end up being the only node in the map and get garbage-ccollected prematurely.
// FIXME: The correct way to do this would be to make HTMLImageElement derive from
// ActiveDOMObject and use its interface to keep its wrapper alive. Then we would
// remove this code and the special case in isObservableThroughDOM.
于 2012-06-14T11:42:33.780 回答
7

如果您没有将它们添加到 DOM 中（例如使用appendChild到父级），那么removeChild就没用了。Image 对象仅在内存中。

并且要处理内存中的项目，您只需要删除对这些对象的引用（例如将引用变量设置为 null），然后垃圾收集会完成剩下的工作。如果您不能将它们全部清空，它们将不会被 GC 处理。

于 2012-06-14T11:25:04.710 回答
4

摆脱 chrome 和特别是 IE 和 EDGE 的“天真主义者”所描述的错误。您可以将图像源更改为空，使其占用零内存。

image.src = '';
image = null;
于 2016-06-10T07:56:45.947 回答
2

AFAIK，分配null应该清理它：images[i] = null

于 2012-06-14T11:25:29.743 回答
1

我认为唯一的方法是这样做：

for( i = 0; i < images.length; i++ ) 
  images[i] = null;
}

// or just 
images = null;
于 2012-06-14T11:25:16.317 回答