检查页面中是否呈现了javascript DOM元素

Question

我正在尝试检查html页面中是否存在DOM js元素。类似这样的东西：

var a = document.querySelector('div'),
b = document.createElement('div');

var f = () => {
// some code
}

<div>hello world</div>

本质上，执行f(a)应该返回true，但是执行f(b)应该返回false。
这可能吗？谢谢

Answer 1

您可以使用contains方法来执行此操作，在document上调用它。

const
a = document.querySelector('div'),
b = document.createElement('div');

const f = element => {
return document.contains(element);
};
console.log(f(a)); // true
console.log(f(b)); // false

<div>hello world</div>

或者，您可以跟随元素的parentNode，直到它是null(没有其他父级(或document:

const
a = document.querySelector('div'),
b = document.createElement('div');

const f = node => {
let inDom = false;
while (node && node.parentNode) {
if (node.parentNode === document) {
inDom = true;
break;
}
node = node.parentNode;
}
return inDom;
};
console.log(f(a)); // true
console.log(f(b)); // false

<div>hello world</div>