js-Node对象属性

来源：互联网发布：服务器开启80端口编辑：程序博客网时间：2024/06/07 13:39

nodeName
nodeType
nodeValue

使用dom解析html时候，需要html里面的标签，属性和文本都封装成对象。

标签节点对应的值：

nodeType ： 1
nodeName：大写标签的名称比如span
nodeValue：属性的值

属性节点对应的值：

nodeType ： 2
nodeName：属性名称
nodeValue：属性的值

文本节点对应的值：

nodeType ： 3
nodeName：#text
nodeValue：属性的值

<body> <span id="spanid">eeeeee</span> <script type="text/javascript"> var span1=document.getElementById("spanid"); //获取标签对象 alert(span1.nodeType); alert(span1.nodeName); alert(span1.nodeValue); //获取属性 var id1=span1.getAttributeNode("id"); alert(id1.nodeType); alert(id1.nodeName); alert(id1.nodeValue);  //获取文本 var tex1=span1.firstChild;     alert(tex1.nodeType);     alert(tex1.nodeName);     alert(tex1.nodeValue); </script> </body>

父节点： ul是li的父节点
parentNode

<ul>    <li>aaaaa</li>    <li>bbbbb</li> </ul>1
2
3
4
1
2
3
4

子节点：li是ul的子节点
childNodes：得到所有的子节点，但是兼容性很差
firstChild：获取第一个子节点
lastChild：获取最后一个子节点
同辈节点：li之间关系是同辈节点
nextSibling:返回一个给定节点的下一个兄弟节点。
previousSibling：返回一个给定节点的上一个兄弟节点。

<body> <ul id="ul1">    <li id="li1">aaaaa</li>    <li id="li2">bbbbb</li>    <li id="li3">bbbbb</li> </ul> <script type="text/javascript"> //获取父节点 var li1=document.getElementById("li1"); alert(li1.parentNode.id); //获取子节点 var li1=document.getElementById("ul1"); alert(ul1.firstChild.id); alert(ul1.lastChild.id);//获取同辈节点 var li1=document.getElementById("li1"); alert(li1.nextSibling.id); alert(li1.previousSibling.id); </script> </body>

0 0