javascript - 如何知道使用 document.createElement 创建的元素是否仍然存在

Question

我在 PhantomJS 测试中使用 document.createElement 创建一个 anchor 元素，如下所示:

var mockLink = null;

beforeEach(function() {
  mockLink = document.createElement('a');
});

it('should foo', function() {
  // Use mockLink in some way
});

我想清理 afterEach 代码中的元素，以便每个测试都有一个新创建的实例。不幸的是，PhantomJS 不支持 element.remove()。 Source

afterEach(function() {
  mockLink.remove();  // Error!
});

我想在不添加 webpage plugin 的情况下执行此操作.

PhantomJS 支持

removeChild，但我新创建的元素没有父元素:

mockLink.parentElement // undefined
mockLink.parentElement.removeChild(mockLink); // doesn't work
mockLink.parentNode // also undefined

我新创建的链接似乎也根本不在文档中。

mockLink.href = 'www.google.com';
document.getElementsByTagName('a'); // doesn't contain google.com

所以我做不到

document.removeChild(mockLink);

mockLink.ownerDocument.contains(mockLink) 也返回 false

除了我的 mockLink 变量之外，似乎没有对 mockLink 的引用存储在任何地方，这意味着我可以将 mockLink 设置为等于 null 如果我想让垃圾回收释放该内存。但我如何验证这是否有效？如果我将任何其他变量设置为 mockLink ，然后将其设置为 console.log ，它仍然会按定义出现，因为它将是对内存中同一空间的新引用。当我将变量设置为 null 时，如何验证 mockLink 是否确实被删除？

Answer 1

您发现自己遇到了难题。

如果通过设置 mockLink = null 并确保没有其他对该元素的引用来终止对该元素的所有引用，则垃圾收集器应该能够释放该对象。

但是，您无法验证这一点，因为为了验证该元素不再可用，您必须保留对它的引用，但这会阻止它首先被垃圾收集。因此，这是一个难题。

这是一个无法真正从 Javascript 本身直接衡量的问题。

如果你想设计一个一次性测试来确保内存被回收，那么你可以拍一张内存快照，创建一个几十万个对象存储在一个数组中，清除数组，等待一小会儿GC 运行，拍摄另一个内存快照，多次重复相同的过程，并验证该进程的内存使用量是否没有稳定增加，或研究内存快照以确保这些对象都不会出现在内存占用中。