如何判断元素是否为HTMLElement元素

我们经常使用nodeType==1判断元素是否是一个HMTLElement元素。页面上的元素都是节点(Node)，有元素节点(Element Node)、属性节点(Attribute Node)、文本节点(Text Node)等。w3c nodeType 的定义如下

const unsigned short ELEMENT_NODE = 1;
const unsigned short ATTRIBUTE_NODE = 2;
const unsigned short TEXT_NODE = 3;
const unsigned short CDATA_SECTION_NODE = 4;
const unsigned short ENTITY_REFERENCE_NODE = 5;
const unsigned short ENTITY_NODE = 6;
const unsigned short PROCESSING_INSTRUCTION_NODE = 7;
const unsigned short COMMENT_NODE = 8;
const unsigned short DOCUMENT_NODE = 9;
const unsigned short DOCUMENT_TYPE_NODE = 10;
const unsigned short DOCUMENT_FRAGMENT_NODE = 11;
const unsigned short NOTATION_NODE = 12;

但如果我们自定义的对象也包含nodeType属性呢？如


代码如下:

var obj = {nodeType:1};
function isHTMLElement(obj){
    if(obj.nodeType){
        return obj.nodeType==1;
    }
}
isHTMLElement(obj);//true

以上isHTMLElement(obj)返回true，但obj明显不是一个HTML节点元素。下面通过对象特性及try-catch语句来判断。


代码如下:

function isHTMLElement(obj){
    var d = document.createElement("div");
    try{
        d.appendChild(obj.cloneNode(true));
        return obj.nodeType==1?true:false;
    }catch(e){
        return false;
    }
}
var obj1 = {nodeType:1};
var obj2 = document.createTextNode("hello");
var obj2 = document.createElement("p");
isHTMLElement(obj1);//false
isHTMLElement(obj2);//false
isHTMLElement(obj3);//true

对于window和document还要特别处理下


代码如下:

function isHtmlControl(obj) {

var d = document.createElement("div");
    try{
        d.appendChild(obj.cloneNode(true));
        return obj.nodeType==1 ? true : false;
    }catch(e){
        return obj==window || obj==document;
    }
}

赞 (0)

相关推荐

  • 如何判断元素是否为HTMLElement元素

    我们经常使用nodeType==1判断元素是否是一个HMTLElement元素.页面上的元素都是节点(Node),有元素节点(Element Node).属性节点(Attribute Node).文本节点(Text Node)等.w3c nodeType 的定义如下 const unsigned short ELEMENT_NODE = 1; const unsigned short ATTRIBUTE_NODE = 2; const unsigned short TEXT_NODE = 3;

  • JavaScript判断数组是否包含指定元素的方法

    本文实例讲述了JavaScript判断数组是否包含指定元素的方法.分享给大家供大家参考.具体如下: 这段代码通过prototype定义了数组方法,这样就可以在任意数组调用contains方法 /** * Array.prototype.[method name] allows you to define/overwrite an objects method * needle is the item you are searching for * this is a special variab

  • 判断数组是否包含某个元素的js函数实现方法

    判断数组是否包含某个元素的js函数实现方法 Array.prototype.contains = function(obj) { var i = this.length; while (i--) { if (this[i] === obj) { return true; } } return false; } 或 Array.prototype.contains = function(element) { for (var i = 0; i < this.length; i++) { if (t

  • python实现判断数组是否包含指定元素的方法

    本文实例讲述了python实现判断数组是否包含指定元素的方法.分享给大家供大家参考.具体如下: python判断数组是否包含指定的元素的方法,直接使用in即可,python真是简单易懂 print 3 in [1, 2, 3] # membership (1 means true inventory = ["sword", "armor", "shield", "healing potion"] if "healin

  • Python实现变量数值交换及判断数组是否含有某个元素的方法

    Python实现变量数值交换及判断数组是否含有某个元素的方法

    本文实例讲述了Python实现变量数值交换及判断数组是否含有某个元素的方法.分享给大家供大家参考,具体如下: 本来,这两个问题都属于的编程入门简单得不能再简单的问题,根本就不值得写篇记录来记录的. 一.变量数值交换 先说变量数值交换,从C语言开始,我们就知道要先设置一个临时变量,再把某元素的值覆盖此临时变量,避免临时覆盖等,如果不设置临时变量,还有位运算的交换形式 然而Python中根本就不用这么复杂,如果要交换变量e1,e2彼此的值,就下面一行代码就足矣: e1,e2=e2,e1; 比如,如下

  • Java判断List中有无重复元素的方法

    Talk is cheap, show me the code: import java.util.ArrayList; import java.util.HashSet; import java.util.List; /** * 通过简单的代码判断List中是否包含相同元素 * @author wei 2017年7月10日 下午8:34:47 */ public class ListHaveRepeat { public static void main(String[] args) { Li

  • Java判断List中相同值元素的个数实例

    如下所示: Map<Object, Integer> map = new TreeMap<Object, Integer>(); for (Object i : listIp) { if (map.get(i) == null) { map.put(i, 1); } else { map.put(i, map.get(i) + 1); } } 以上这篇Java判断List中相同值元素的个数实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • JS实现判断数组是否包含某个元素示例

    JS实现判断数组是否包含某个元素示例

    本文实例讲述了JS实现判断数组是否包含某个元素.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> Array.prototype.S = String.fromC

  • 浅谈layui数据表格判断问题(加入表单元素),设置单元格样式

    如下所示: <script type="text/html" id="status"> {{# if(d.status === 1){ }} <span class="layui-badge layui-bg-green">正常</span> {{# } else { }} <span class="layui-badge">禁用</span> {{# } }} &l

  • JS判断数组是否包含某元素实现方法汇总

    我在学习ES6数组拓展时,发现了新增了不少了有趣的数组方法,突然想好工作中判断数组是否包含某个元素是非常常见的操作,那么这篇文章顺便做个整理. 1.for循环结合break 可能很多人第一会想到for循环,毕竟for是最为保险和熟悉的操作: let arr = [1, 2, undefined, '听风是风', 'echo'], i = 0; const LENGTH = arr.length; //初始化result状态,只要能找到匹配的则修改为true let result = false;

随机推荐