JS 判断节点类型

节点类型的分类

节点类型说明值元素节点每一个HTML标签都是一个元素节点，如 <div> 、 <p>、<ul>等1属性节点元素节点（HTML标签）的属性，如 id 、class 、name 等。2文本节点元素节点或属性节点中的文本内容。3注释节点表示文档注释，形式为<!-- comment text -->。8文档节点表示整个文档（DOM 树的根节点，即 document ）9

 

 

 

 

 

 

nodeType、nodeName、nodeVale判断节点类型，节点名称和节点值

<!--使用javascript判断节点类型--> <div id="oneDiv">一段文本</div><!--注释文本--> <script type="text/javascript"> var div = document.getElementById("oneDiv"); console.log(div.nodeType); //输出1，元素节点 var divText = div.firstChild; console.log(divText.nodeType) //输出3，文本节点 var divAttr = div.getAttributeNode("id"); console.log(divAttr.nodeType) //输出2，属性节点 var comment = div.nextSibling; console.log(comment.nodeType) //输出8，注释节点 </script>

 

<!--使用javascript判断节点名称--> <div id="oneDiv">一段文本</div><!--注释文本--> <script type="text/javascript"> var div = document.getElementById("oneDiv"); console.log(div.nodeName); //输出DIV，元素节点为标签大写 var divText = div.firstChild; console.log(divText.nodeName) //输出#text，文本节点使用nodeName时永远为#text var divAttr = div.getAttributeNode("id"); console.log(divAttr.nodeName) //输出id，属性节点为属性名 var comment = div.nextSibling; console.log(comment.nodeName) //输出#comment，注释节点使用nodeName时永远为#comment </script>

 

<!--使用javascript判断节点值--> <div id="oneDiv">一段文本</div><!--注释文本--> <script type="text/javascript"> var div = document.getElementById("oneDiv"); console.log(div.nodeValue); //输出null，元素节点对于nodeValue不支持 var divText = div.firstChild; console.log(divText.nodeValue) //输出一段文本，文本节点输出文本值 var divAttr = div.getAttributeNode("id"); console.log(divAttr.nodeValue) //输出oneDiv，属性节点输出属性值 var comment = div.nextSibling; console.log(comment.nodeValue) //输出注释文本，注释节点输出注释内容 </script>

 

转载于:https://www.cnblogs.com/YAN-HUA/p/9517242.html