javascript - HTML 元素附加到文档

Question

当使用 removeChild() 从 DOM 中删除一个元素时，对该元素的引用仍然存在，但该元素不再存在于 DOM 中。
如何知道 HTML 元素(或其父元素)是否仍附加到文档？

Answer 1

您可以使用 Node#contains()检查元素是否在特定文档或另一个元素中:

if(document.contains(yourElement)) {
    // Yep, it's attached to the current document
}

或Node#isConnected检查它是否连接到任何文档:

if(yourElement.isConnected) {
    // Yep, it's attached to any documents
}

Shadow DOM 中元素的注意事项:

• .contains() 需要 getRootNode() 调用才能到达主文档中的最顶层元素，可能是递归的:document.contains(yourElement .getRootNode().host)
• .isConnected 将为 true，即使该元素未连接到主 document，例如，如果它位于 Shadow DOM 中或当前文档中不的 iframe。