如何检查一个元素是否存在于 DOM 中或 JavaScript 中不存在

Question

我用这段代码从 DOM 中删除了一个元素：

box1.parentNode.removeChild(box1);

如何检查 box1 是否在 DOM 中。

我想要这个，因为如果我再次尝试从 DOM 中删除它，这将导致错误。

Answer 1

Node.contains() 方法返回一个布尔值，指示节点是否是给定节点的后代。

您可以使用Contain：

if( node.contains( otherNode ) ){
    //Your code here
}

注意：要签入所有 DOM，请使用 document.contains(node)。

希望这会有所帮助。

Answer 2

您可以只使用parentNode 属性来查看节点是否已附加。

var div = document.querySelector('div');
console.log(div.parentNode !== null); //Attached, true
div.parentNode.removeChild(div);
console.log(div.parentNode !== null); //Not attached, false

<div></div>

Answer 3

var box1 = document.getElementById("box1") // EXAMPLE to get an element

if (box1.parentNode && box1.parentNode.contains(box1)) {
  box1.parentNode.removeChild(box1);
}

// Example: won't trigger an error:
if (box1.parentNode && box1.parentNode.contains(box1)) {
  box1.parentNode.removeChild(box1);
}

// Example: would trigger an error:
box1.parentNode.removeChild(box1);

<div id="box1">a</div>
<div id="box2">b</div>
<div id="box3">c</div>