返回首页
当前位置: 主页 > 编程语言 > XML教程 >

XML DOM-导航

时间:2020-07-07 11:28来源:电脑教程学习网 www.etwiki.cn 编辑:小山哥

到目前为止,我们研究了DOM结构,如何加载和解析XML DOM对象以及如何遍历DOM对象。在这里,我们将看到如何在DOM对象中的节点之间导航。XML DOM由节点的各种属性组成,可帮助我们浏览节点,例如-

  • parentNode
  • 子节点
  • 第一个孩子
  • 最后一个孩子
  • nextSibling
  • 以前的兄弟姐妹

以下是一个节点树图,显示了它与其他节点的关系。

XML DOM导航

DOM-父节点

此属性将父节点指定为节点对象。

以下示例(navigate_example.htm)将XML文档(node.xml解析为XML DOM对象。然后通过子节点将DOM对象导航到父节点-

<!DOCTYPE html>
<html>
   <body>
      <script>
         if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
         } else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         }
         xmlhttp.open("GET","/dom/node.xml",false);
         xmlhttp.send();
         xmlDoc = xmlhttp.responseXML;

         var y = xmlDoc.getElementsByTagName("Employee")[0];
         document.write(y.parentNode.nodeName);
      </script>
   </body>
</html>

如上例所示,子节点Employee导航到其父节点。

执行

此文件另存为navigate_example.html服务器的路径上(此文件并node.xml应该在你的服务器在同一路径上)。在输出中,我们获得Employee的父节点,即Company

第一个孩子

此属性的类型为Node,表示NodeList中存在的第一个子名称。

下面的例子(first_node_example.htm)解析XML文档(node.xml)成XML DOM对象,然后导航到第一个子节点存在于DOM对象的。

<!DOCTYPE html>
<html>
   <body>
      <script>
         if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
         } else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         }
         xmlhttp.open("GET","/dom/node.xml",false);
         xmlhttp.send();
         xmlDoc = xmlhttp.responseXML;

         function get_firstChild(p) {
            a = p.firstChild;

            while (a.nodeType != 1) {
               a = a.nextSibling;
            }
            return a;
         }
         var firstchild = get_firstChild(xmlDoc.getElementsByTagName("Employee")[0]);
         document.write(firstchild.nodeName);
      </script>
   </body>
</html>
  • 函数get_firstChild(p)用于避免空节点。这有助于从节点列表中获取firstChild元素。

  • x = get_firstChild(xmlDoc.getElementsByTagName(“ Employee”)[0])获取标签名称Employee的第一个子节点

执行

将此文件另存为first_node_example.htm在服务器路径上(此文件和node.xml应该在服务器上的同一路径上)。在输出中,我们获得Employee的第一个子节点, 即FirstName

最后一个孩子

此属性的类型为Node,代表NodeList中存在的最后一个子名称。

下面的例子(last_node_example.htm)解析XML文档(node.xml)成XML DOM对象,然后导航到子节点存在于XML DOM对象的最后。

<!DOCTYPE html>
  <body>
      <script>
         if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
         } else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         }
         xmlhttp.open("GET","/dom/node.xml",false);
         xmlhttp.send();
         xmlDoc = xmlhttp.responseXML;

         function get_lastChild(p) {
            a = p.lastChild;

            while (a.nodeType != 1){
               a = a.previousSibling;
            }
            return a;
         }
         var lastchild = get_lastChild(xmlDoc.getElementsByTagName("Employee")[0]);
         document.write(lastchild.nodeName);
      </script>
   </body>
</html>

执行

将此文件另存为server_path上的last_node_example.htm(此文件和node.xml应位于服务器上的同一路径上)。在输出中,我们获得Employee的最后一个子节点Email

下一个兄弟姐妹

该属性的类型为Node,表示下一个子元素,即,存在于NodeList中的指定子元素的下一个同级元素。

以下示例(nextSibling_example.htm)将XML文档(node.xml)解析为XML DOM对象,该对象立即导航到xml文档中存在的下一个节点。

<!DOCTYPE html>
   <body>
      <script>
         if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
         }
         else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         }
         xmlhttp.open("GET","/dom/node.xml",false);
         xmlhttp.send();
         xmlDoc = xmlhttp.responseXML;

         function get_nextSibling(p) {
            a = p.nextSibling;

            while (a.nodeType != 1) {
               a = a.nextSibling;
            }
            return a;
         }
         var nextsibling = get_nextSibling(xmlDoc.getElementsByTagName("FirstName")[0]);
         document.write(nextsibling.nodeName);
      </script>
   </body>
</html>

执行

将此文件另存为服务器路径上的nextSibling_example.htm(此文件和node.xml应该在服务器中的同一路径上)。在输出中,我们获得FirstName的下一个同级节点LastName

以前的兄弟姐妹

此属性的类型为Node,表示先前的子元素,即,存在于NodeList中的指定子元素的先前的同级元素。

以下示例(previoussibling_example.htm)将XML文档(node.xml)解析为XML DOM对象,然后浏览xml文档中存在的最后一个子节点的before节点。

<!DOCTYPE html>
   <body>
      <script>
         if (window.XMLHttpRequest)
         {
            xmlhttp = new XMLHttpRequest();
         } else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         }
         xmlhttp.open("GET","/dom/node.xml",false);
         xmlhttp.send();
         xmlDoc = xmlhttp.responseXML;

         function get_previousSibling(p) {
            a = p.previousSibling;

            while (a.nodeType != 1) {
               a = a.previousSibling;
            }
            return a;
         }

         prevsibling = get_previousSibling(xmlDoc.getElementsByTagName("Email")[0]);
         document.write(prevsibling.nodeName);
      </script>
   </body>
</html>

执行

将此文件另存为服务器路径上的previoussibling_example.htm(此文件和node.xml应该在服务器中的同一路径上)。在输出中,我们获得Email的前一个兄弟节点ContactNo

 上一页  打印页面

------分隔线----------------------------
标签(Tag):
------分隔线----------------------------
推荐内容
  • XML DOM - Accessing

    在本章中,我们将研究如何访问被视为XML文档信息单元的XML DOM节点。 XML DOM的节点结...

  • XML DOM-导航

    到目前为止,我们研究了DOM结构,如何加载和解析XML DOM对象以及如何遍历DOM对象。 在...

  • XML DOM-遍历

    在本章中,我们将讨论XML DOM遍历。 在 上一章 中,我们研究了 如何加载XML文档并解析...

  • XML DOM-载入中

    在本章中,我们将研究XML 加载 和 解析 。 为了描述API提供的接口,W3C使用一种称为接...

  • XML DOM-方法

    作为API的DOM包含表示可以在XML文档中找到的不同类型信息的接口,例如元素和文本。 这...

  • XML DOM-节点树

    在本章中,我们将研究XML DOM 节点树。 在XML文档中,信息以分层结构维护; 这种分层...

猜你感兴趣