DOM中的节点属性
Posted 豆芽花花儿酱
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了DOM中的节点属性相关的知识，希望对你有一定的参考价值。
我们在做web测试时，适当了解前端的知识有助于我们测试工作中bug的定位，同时也有助于自动化测试中的元素定位。下面我简单写一下关于javascript中的DOM的节点元素。
DOM ，文件对象模型，主要是针对html 和XML文档中的一个api(应用程序接口)。DOM定义了访问和处理HTML文档的标准方法，描绘了一个层次化的节点树。DOM将HTML文档呈现出元素、属性和文本的树形结构。
在DOM中，每一个节点都是一个对象。DOM节点都有三个重要的属性：
1. nodeName : 节点的名称
2. nodeValue ：节点的值
3. nodeType ：节点的类型
一、nodeName 属性: 节点的名称，是只读的。
1. 元素节点的 nodeName 与标签名相同
2. 属性节点的 nodeName 是属性的名称
3. 文本节点的 nodeName 永远是 #text
4. 文档节点的 nodeName 永远是 #document
二、nodeValue 属性：节点的值
1. 元素节点的 nodeValue 是 undefined 或 null
2. 文本节点的 nodeValue 是文本自身
3. 属性节点的 nodeValue 是属性的值
三、nodeType 属性: 节点的类型，是只读的。
以下常用的几种结点类型:
元素类型 节点类型
元素 1
属性 2
文本 3
注释 8
文档 9
例子：获取所有li标签，并输出相应节点的名称、节点的值和节点的类型 ：
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>节点属性</title> 6 </head> 7 <body> 8 <ul> 9 <li>javascript</li> 10 <li>HTML/CSS</li> 11 <li>jQuery</li> 12 </ul> 13 <script type="text/javascript"> 14 var li=document.getElementsByTagName("li"); 15 for(var i=0;i<li.length;i++){ 16 document.write("节点名称："+li[i].nodeName+" 节点属性："+li[i].nodeValue+"节点类型："+li[i].nodeType+"<br/>"); 17 } 18 </script> 19 </body> 20 </html>
以上是关于DOM中的节点属性的主要内容，如果未能解决你的问题，请参考以下文章