属性和方法向 XML DOM 定义了编程接口。
实例
下面的例子使用 XML 文件 books.xml。
函数 loadXMLDoc(),位于外部 JavaScript 中,用于加载 XML 文件。
函数 loadXMLString(),位于外部 JavaScript 中,用于加载 XML 字符串。
加载并解析 XML 文件加载并解析 XML 字符串
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmlstring.js"></script> </head> <body> <script type="text/javascript"> text="<bookstore>" text=text+"<book>"; text=text+"<title>Harry Potter</title>"; text=text+"<author>J K. Rowling</author>"; text=text+"<year>2005</year>"; text=text+"</book>"; text=text+"</bookstore>"; xmlDoc=loadXMLString(text); document.write(xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("author")[0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("year")[0].childNodes[0].nodeValue); </script> </body> </html>
编程接口
DOM 把 XML 模拟为一系列节点接口。可通过 JavaScript 或其他编程语言来访问节点。在本教程中,我们使用 JavaScript。
对 DOM 的编程接口是通过一套标准的属性和方法来定义的。
属性经常按照“某事物是什么”的方式来使用(例如节点名是 “book”)。
方法经常按照“对某事物做什么”的方式来使用(例如删除 “book” 节点)。
XML DOM 属性
一些典型的 DOM 属性:
- x.nodeName – x 的名称
- x.nodeValue – x 的值
- x.parentNode – x 的父节点
- x.childNodes – x 的子节点
- x.attributes – x 的属性节点
注释:在上面的列表中,x 是一个节点对象。
XML DOM 方法
- x.getElementsByTagName(name) – 获取带有指定标签名称的所有元素
- x.appendChild(node) – 向 x 插入子节点
- x.removeChild(node) – 从 x 删除子节点
注释:在上面的列表中,x 是一个节点对象。
实例
从 books.xml 中的 <title> 元素获取文本的 JavaScript 代码:
txt=xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue
在此语句执行后,txt 保存的值是 “Harry Potter”。
解释:
- xmlDoc – 由解析器创建的 XML DOM
- getElementsByTagName(“title”)[0] – 第一个 <title> 元素
- childNodes[0] – <title> 元素的第一个子节点 (文本节点)
- nodeValue – 节点的值 (文本自身)
在上面的例子中,getElementsByTagName 是方法,而 childNodes 和 nodeValue 是属性。
解析 XML 文件 – 跨浏览器实例
下面的代码片段使用 loadXMLDoc 函数把 books.xml 载入 XML 解析器中,并显示第一个 book 的数据:
xmlDoc=loadXMLDoc("books.xml"); document.write(xmlDoc.getElementsByTagName("title") [0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("author") [0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("year") [0].childNodes[0].nodeValue);
输出:
Harry Potter J K. Rowling 2005
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); document.write(xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("author")[0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("year")[0].childNodes[0].nodeValue); </script> </body> </html>
在上面的例子中,我们为每个文本节点使用 childNodes[0],即使每个元素只有一个文本节点。这是由于 getElementsByTagName() 方法总是会返回数组。
解析 XML 字符串 – 跨浏览器实例
下面的代码加载并解析一个 XML 字符串:
下面的代码片段使用 loadXMLString 函数把 books.xml 载入 XML 解析器,并显示第一个 book 的数据:
text="<bookstore>" text=text+"<book>"; text=text+"<title>Harry Potter</title>"; text=text+"<author>J K. Rowling</author>"; text=text+"<year>2005</year>"; text=text+"</book>"; text=text+"</bookstore>"; xmlDoc=loadXMLString(text); document.write(xmlDoc.getElementsByTagName("title") [0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("author") [0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("year") [0].childNodes[0].nodeValue);
输出:
Harry Potter J K. Rowling 2005
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmlstring.js"></script> </head> <body> <script type="text/javascript"> text="<bookstore>" text=text+"<book>"; text=text+"<title>Harry Potter</title>"; text=text+"<author>J K. Rowling</author>"; text=text+"<year>2005</year>"; text=text+"</book>"; text=text+"</bookstore>"; xmlDoc=loadXMLString(text); document.write(xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("author")[0].childNodes[0].nodeValue); document.write("<br />"); document.write(xmlDoc.getElementsByTagName("year")[0].childNodes[0].nodeValue); </script> </body> </html>
作者:terry,如若转载,请注明出处:https://www.web176.com/xmldom/10855.html