Question

所以我有一个DOM元素的引用，我对此一无所知：

NEW_URL

我不想使用jQuery，或选择器和fetch元素的var div = somePieceOfCodeReturningDomElement();，id或其他属性，它应该是一个Vanilla JS解决方案。我正在寻找这样的东西：

class

当元素放在DOM中但随后被删除时，它也必须起作用。我不知道它是否会改变，但这是一项要求。

Answer 1

我找到问题的答案here：

Document和DocumentFragment节点永远不会有父节点，所以   parentNode将始终返回null。

如果刚刚创建了节点，它也会返回null   附在树上。

所以函数看起来像这样：

function isInTheDom(element) {
    return !!element.parentNode;
}

当元素附加到DOM但随后被取出时，它的效果很好。

如果要检查元素是否在分离树中，可以创建如下函数：

function isInDetachedTree(element) {
    var parent;

    while (isInTheDom(element)) {
        element = element.parentNode;
    }

    if (
        element.nodeType === Node.DOCUMENT_NODE ||
        element.nodeType === Node.DOCUMENT_FRAGMENT_NODE
    ) {
        return false;
    }

    return true;
}

要测试它，请转到https://developer.mozilla.org/en-US/docs/Web/API/Node/removeChild，打开控制台并粘贴这两个函数和此代码：

var el = document.getElementById('wiki-column-container');
var container = document.getElementById('content');
console.log(isInDetachedTree(el));
console.log(isInDetachedTree(document));
console.log(isInDetachedTree(container));

console.log('Removing #content element from DOM');

container = container.parentNode.removeChild(container);
console.log(isInDetachedTree(el));
console.log(isInDetachedTree(document));
console.log(isInDetachedTree(container));

检查现有DOM元素引用是否指向DOM中的元素

1 个答案: