Answers:
if (element.nodeName == "A") {
...
} else if (element.nodeName == "TD") {
...
}
也许您也必须检查节点类型:
if(element.nodeType == 1){//element of type html-object/tag
if(element.tagName=="a"){
//this is an a-element
}
if(element.tagName=="div"){
//this is a div-element
}
}
编辑:更正了nodeType值
text/html
。)
element.tagName.toLowerCase() === 'a'
element.nodeName.toLowerCase()
是否有可能element
实际上不是一个元素(例如,如果您没有完成nodeType == 1
上面列出的检查)。该Node
接口具有nodeName
。对于Element
情况下,这是一样的tagName
。对于其他类型的节点,则为"#text"
或"#document"
。我想我总是会用nodeType
支票。
node.tagName == 'DIV'
弯曲是正确的,但是您需要将测试更改为:
if(element.nodeType == 1){ //码 }
因为nodeType为3实际上是一个文本节点,而nodeType为1是HTML元素。参见http://www.w3schools.com/Dom/dom_nodetype.asp
我通常从toString()返回值获取它。它可以在不同访问的DOM元素中工作:
var a = document.querySelector('a');
var img = document.createElement('img');
document.body.innerHTML += '<div id="newthing"></div>';
var div = document.getElementById('newthing');
Object.prototype.toString.call(a); // "[object HTMLAnchorElement]"
Object.prototype.toString.call(img); // "[object HTMLImageElement]"
Object.prototype.toString.call(div); // "[object HTMLDivElement]"
然后相关的部分:
Object.prototype.toString.call(...).split(' ')[1].slice(0, -1);
它适用于Chrome,FF,Opera,Edge,IE9 +(在较旧的IE中,它返回“ [object Object]”)。
尽管前面的答案很完美,但我将添加另一种方式,也可以使用它们已实现的接口对元素进行分类。
console.log(document.querySelector("#anchorelem") instanceof HTMLAnchorElement);
console.log(document.querySelector("#divelem") instanceof HTMLDivElement);
console.log(document.querySelector("#buttonelem") instanceof HTMLButtonElement);
console.log(document.querySelector("#inputelem") instanceof HTMLInputElement);
<a id="anchorelem" href="">Anchor element</a>
<div id="divelem">Div Element</div>
<button id="buttonelem">Button Element</button>
<br><input id="inputelem">
接口检查可以通过两种方式进行,如elem instanceof HTMLAnchorElement
或elem.constructor.name == "HTMLAnchorElement"
,均返回true
element.nodeName.match(/\bTBODY\b/i)
或element.nodeName.toLowerCase() == 'tbody'
等