分离的DOM元素是已从DOM中删除的元素,但是由于JavaScript的原因,它们的内存仍然保留。这意味着只要元素对任何变量或对象的引用在任何地方,即使从DOM中销毁后也不会进行垃圾回收。
DOM就像一棵双链接树,这意味着对树中某个节点的引用将使整个树停止进行垃圾收集。
让我们以在javascript中创建DOM元素为例。创建元素后,销毁它,但是忘记删除保存它的变量。这种情况导致分离的DOM,它不仅引用特定的DOM元素,而且还引用整个树。
在下面的示例中,即使从DOM中删除了``someText''之后,它仍然在全局``值''对象中具有引用,这就是为什么它无法从垃圾回收器中删除并继续消耗内存的原因,这会导致内存泄漏。
<html> <body> <script> var example = document.createElement("p"); example.id = "someText"; document.body.appendChild(example); var value = { text: document.getElementById('someText') }; function createFun() { value.text.innerHTML = "Javascript is not Java"; } createFun(); function deleteFun() { document.body.removeChild(document.getElementById('someText')); } deleteFun(); </script> </body> </html>
为了避免内存泄漏,最佳实践是将var example放在侦听器中,这使其成为局部变量。当删除var example时,对象的路径将被切断,从而使垃圾回收器释放内存。