Parsing and serializing XML

有时,你可能需要解析 XML 内容,并把它转换为 DOM 树,或者,反过来将现有的 DOM 树序列化成 XML。在本文中,我们将查看 Web 平台提供的对象,以便轻松地序列化和解析 XML 的常见任务。

XMLSerializer

序列化 DOM 树,把它们转换成包含 XML 的字符串。

DOMParser

通过解析一个包含 XML 的字符串来构建 DOM 树,返回一个基于输入数据的适当的 XMLDocument 或者是 Document

XMLHttpRequest

从一个 URL 中加载内容;XML 的内容被作为一个带有内建 XML 的 DOM 树的 XML Document 对象返回。

XPath

一种创建包含 XML 文档特定部分的地址,并基于这些地址进行 XML 节点定位的字符串的技术。

创建一个 XML 文档

使用以下方法来创建一个 XML 文档(该文档是 Document 的一个例子)。

把字符串解析成 DOM 树

下面这个例子使用 DOMParser 把字符串中的 XML 片段转换为 DOM 树:

var sMyString = '<a id="a"><b id="b">hey!</b></a>';
var oParser = new DOMParser();
var oDOM = oParser.parseFromString(sMyString, "application/xml");
// print the name of the root element or error message
console.log(oDOM.documentElement.nodeName == "parsererror" ? "error while parsing" : oDOM.documentElement.nodeName);

把可寻址的 URL 资源解析成 DOM 树

使用 XMLHttpRequest

下列示例代码读取一个可寻址的 URL 资源文件并将其解析成 DOM 树:

var xhr = new XMLHttpRequest();
xhr.onload = function() {
  dump(xhr.responseXML.documentElement.nodeName);
}
xhr.onerror = function() {
  dump("Error while getting XML.");
}
xhr.open("GET", "example.xml");
xhr.responseType = "document";
xhr.send();

xhr 对象 responseXML 域中返回的值 是一个通过解析 XML 构造的 Document

如果这个文档是 HTML,上面实例代码将会返回一个 Document。如果它是 XML,那获取的结果对象实际上是一个 XMLDocument。这两种类型实质上是一样的; 不同点大部分是历史遗留的,尽管区分它们也会有一些实际好处。

备注: 事实上,HTMLDocument 也是一个接口,但是它不必是一个独立的类型。在一些浏览器上是,但在另外一些浏览器上它仅仅是 Document 接口的别名。

序列化一个 XML 文档

被给一个 Document,你可以使用 XMLSerializer.serializeToString() (en-US) 方法把文档的 DOM 树序列化为 XML。

使用下面的方法来序列化在先前章节中创建的 XML 文档内容。

把 DOM 树 序列化成字符串

首先,使用如何创建一个 DOM 树中的方法构建一个 DOM 树。也可以使用从 XMLHttpRequest 中获得的 DOM 树。

为了序列化 DOM 树的 doc 为 XML 文档,调用 XMLSerializer.serializeToString() (en-US)

var oSerializer = new XMLSerializer();
var sXML = oSerializer.serializeToString(doc);

序列化 HTML 文档

如果你手上的 DOM 是一个 HTML 文档,你可以使用 serializeToString(),但是也有一个更简单的选择:直接用 Element.innerHTML 属性(如果你仅仅想得到指定节点的后代的话)或者是如果你想得到节点本身及它所有的后代的话,你可以使用 Element.outerHTML 属性。

var docHTML = document.documentElement.innerHTML;

因此,docHTML is 一个包含 HTML 内容的文档的 DOMString; 也就是说,<body> 元素的内容。

你可以使用以下代码得到 <body> 和它的后代对应的 HTML:

var docHTML = document.documentElement.outerHTML;

参见