使用document.querySelector或getElementById判断DOM节点是否存在,返回null表示不存在;2. 通过document.body.contains可检测元素是否仍存在于DOM中;3. 应始终对结果进行null判断以避免错误。

判断DOM节点是否存在,可以通过JavaScript提供的多种方式来实现。最常用的方法是使用document.querySelector或document.getElementById等选择器方法,然后检查返回值是否为null或undefined。
使用 querySelector 判断节点是否存在
querySelector可以根据CSS选择器查找元素,如果找到返回元素对象,否则返回null。
示例:
if (document.querySelector('#myId')) {
console.log('元素存在');
} else {
console.log('元素不存在');
}
使用 getElementById 判断ID元素是否存在
对于有ID的元素,getElementById是最直接的方式,找不到时返回null。
if (document.getElementById('myId')) {
console.log('该ID元素存在');
} else {
console.log('该ID元素不存在');
}
检查元素是否已从页面中移除
即使你有一个元素的引用,它也可能已经被从DOM中移除。可以使用contains方法判断某个元素是否仍存在于页面中。
const el = document.getElementById('myId');
if (el && document.body.contains(el)) {
console.log('元素存在且在DOM中');
} else {
console.log('元素不存在或已被移除');
}
基本上就这些方法,简单有效,根据实际选择器类型选用合适的方式即可。注意始终对返回结果做null判断,避免报错。










