js判断变量是否是dom对象

我们在写 js 代码时有时需要判断某个对象是不是 DOM 对象,然后再进行后续的操作,这里我给出一种兼容各大浏览器,同时又算是比较稳妥的一种方法。

要判断一个对象是否 DOM 对象,首先想到的无非就是它是否具有 DOM 对象的各种属性或特征,比如是否有 nodeType 属性,有 tagName 属性,等等。判断的特征越多,也就越可靠,因为毕竟我们自定义的 js 对象也可以有那些属性。还有其他方法吗?

DOM Level2 标准中定义了一个 HTMLElement 对象,它规定所有的 DOM 对象都是 HTMLElement 的实例,所以我们可以利用这点来判断一个对象是不是 DOM 对象: 如果该对象是 HTMLElement 的实例,则它肯定是一个 DOM 对象。在不支持 HTMLElement 的浏览器中我们则还是使用特征检测法。

首先要对 HTMLElement 进行类型检查,因为即使在支持 HTMLElement 的浏览器中,类型却是有差别的,在Chrome,OperaHTMLElement 的类型为 function,此时就不能用它来判断了

1
2
3
4
5
6
7
8
var isDOM =
typeof HTMLElement === 'object'
? function (obj) {
return obj instanceof HTMLElement;
}
: function (obj) {
return obj && typeof obj === 'object' && obj.nodeType === 1 && typeof obj.nodeName === 'string';
};
---- 本文结束,感谢您的阅读 ----