0.背景

开发中本来用的前端组件库ng-zorro。但是一个功能用到了非常迷惑的dom操作。需要遍历一个div,内嵌了不同类型的标签,于是想到通过nodeType来取反。

这篇文章中简单记录一下JS中nodeType类型。

1.nodeType

nodeType属性是用来取反不同类型的节点,比如元素,文本,注释等。

常见的nodeType类型

常量描述
Node.ELEMENT_NODE1一个 元素 节点,例如 <p> 和 <div>。
Node.TEXT_NODE3Element 或者 Attr 中实际的 文字
Node.PROCESSING_INSTRUCTION_NODE7一个用于XML文档的 ProcessingInstruction ,例如 <?xml-stylesheet … ?> 声明。
Node.COMMENT_NODE8一个 Comment 节点。
Node.DOCUMENT_NODE9一个 Document 节点。
Node.DOCUMENT_TYPE_NODE10描述文档类型的 DocumentType 节点。例如 就是用于 HTML5 的。
Node.DOCUMENT_FRAGMENT_NODE11一个 DocumentFragment 节点
2.用法

用法1:

var p = document.createElement("p");
p.textContent="123..";

if(p.nodeType===Node.ELEMENT_NODE)
// true

用法2:

var div = document.getElementByTagName('div')

child = div.childNodes
for(var i=0; i<child.length;i++){
    if(child[i].nodeType==1){
        //...
    }
}
分类: 前端