Question

这是交易 - 我在页面上有大量元素，我正在使用Javascript删除其中一些（this.parentNode.removeChild（this）），这是很好的。但是，如果我有一个引用此节点的变量，然后删除该节点，该变量不会丢失它的值！但是，如果我尝试对此元素执行一些其他操作，我会收到错误！

示例：

var element = document.getElementById('ooolookatmeimanelement');
element.parentNode.removeChild(element);
alert(element);

我仍然在警报中得到“[Object HTMLblahblahblah]”，而不是null或undefined - 任何人都有任何想法我如何检查节点是否已被删除？这可能是一件非常简单的事我忘了！

Answer 1

如果删除节点，也要删除引用。例如。在您的代码中，将null分配给element：

element = null;

如果无法做到这一点，您可以随时查看parentNode的值。如果元素不是DOM的一部分，它应该给null：

if(element.parentNode === null) {
    // element is not part of the DOM
}

但这对我来说没有多大意义（可能取决于上下文）：如果你删除了一个元素，那么你知道你已经删除了它。你为什么要对它做进一步的操作？

Answer 2

.removeChild()仅从DOM中删除元素，而不是从内存中删除。

因此它仍然存在，直到它被收集垃圾。但是你持有它的引用，所以这不会发生。

Answer 3

如果您需要运行由onClick触发的JavaScript，可以节省时间，这可以节省时间，这可以做到这一点：

onClick="if(!document.getElementById(this.id))return false; YOUR CODE HERE"

对我来说，当我有一个DIV有几个孩子的时候出现了这个，其中一个是“删除这个div”按钮（实际上是DIV看起来像一个按钮）。单击时，此“按钮”将按预期从DOM中删除DIV，但随后将调用DIV本身的onClick事件（不再存在）。这引起了问题。通过将此添加到我的DIV的{{1}}，我阻止了在删除后引用onClick的代码。

Answer 4

您也可以使用document.body.contains(element);或$.contains(body, element)。

检查parentNode不可靠;如果删除的是元素的祖先，而不是元素本身，那么parentNode仍将返回父元素，而元素不再存在于DOM中。

＆＃13;

var ancestor = document.querySelector('div');
var ghost = document.querySelector('br');
ancestor.parentNode.removeChild(ancestor);
console.log(ghost.id + ' son of ' + ghost.parentNode.id);
console.log(ghost.id + (document.body.contains(ghost) || ' dont') + ' exists in DOM');

＆＃13;

<div id="ancestorToRemove">
    <p id="a bitch">
        <br id="you">
    </p>
</div>

＆＃13;

检查Javascript中是否存在节点

4 个答案: