JavaScript基础10——node对象

 <!DOCTYPE html>
 <html>
     <head>
         <meta charset="utf-8">
         <title>node对象</title>
         <script type="text/javascript">
             /*
                 Node对象的属性
                     nodeName  节点名称
                     nodeType  节点类型
                     nodeValue 节点值
                 父节点
                     ul是li的父节点
                     parentNode
                 子节点
                     li是ul的子节点
                     childNodes：得到所有的子节点，但是兼容性很差
                     firstChild：获取指定节点的第一个子节点
                     lastChild：获取指定节点的最后一个子节点
                 同辈节点
                     li直接关系是同辈节点
                     nextSibling：返回一个给定节点的下一个兄弟节点
                     previousSibling：返回一个给定节点的上一个兄弟节点
             */
         </script>
     </head>
     <body>
         <span id="spanId">哈哈呵呵</span>
         <script type="text/javascript">
             // 标签节点
             var span = document.getElementById("spanId");
             document.write("<br />nodeType：" + span.nodeType);        // 1
             document.write("<br />nodeName：" + span.nodeName);        // SPAN
             document.write("<br />nodeValue：" + span.nodeValue);    // null
             // 属性节点
             var spanId = span.getAttributeNode("id");
             document.write("<br /><br />nodeType：" + spanId.nodeType);    // 2
             document.write("<br />nodeName：" + spanId.nodeName);        // id
             document.write("<br />nodeValue：" + spanId.nodeValue);        // spanId
             // 文本节点
             var text = span.firstChild;
             document.write("<br /><br />nodeType：" + text.nodeType);    // 3
             document.write("<br />nodeName：" + text.nodeName);            // #text
             document.write("<br />nodeValue：" + text.nodeValue);        // 哈哈呵呵
         </script>
     </body>
 </html>