DOMParser | Web API

在此页

句法
方法
范例
DOMParser HTML 扩展
规范
浏览器兼容性
另请参阅
相关话题

DOMParser 接口提供能力为剖析 XML or HTML 源代码从字符串到 DOM Document .

注意： XMLHttpRequest can parse XML and HTML directly from a URL-addressable resource, returning a Document 在其 response 特性。

You can perform the opposite operation—converting a DOM tree into XML or HTML source—using the XMLSerializer 接口。

In the case of an HTML document, you can also replace portions of the DOM with new DOM trees built from HTML by setting the value of the Element.innerHTML and outerHTML properties. These properties can also be read to fetch HTML fragments corresponding to the corresponding DOM subtree.

句法

let domparser = new DOMParser()

方法

DOMParser.parseFromString()

句法

let doc = domparser.parseFromString(string, mimeType)

要么 Document or XMLDocument 从属 mimeType 自变量。

参数

This method has 2 parameters (both required):

string: DOMString to be parsed. It must contain either HTML , xml , xhtml+xml ，或 svg 文档。
mimeType

`mimeType`	`doc .constructor`
`text/html`	`Document`
`text/xml`	`XMLDocument`
`application/xml`	`XMLDocument`
`application/xhtml+xml`	`XMLDocument`
`image/svg+xml`	`XMLDocument`

范例

剖析 XML

Once you have created a parser object, you can parse XML from a string using the parseFromString() 方法：

let parser = new DOMParser()
let doc = parser.parseFromString(stringContainingXMLSource, "application/xml")

错误处理

Note that if the parsing process fails, the DOMParser does not throw an exception, but instead returns an error document:

<parsererror xmlns="http://www.mozilla.org/newlayout/xml/parsererror.xml">
  (error description)
  <sourcetext>(a snippet of the source XML)</sourcetext>
</parsererror>

The parsing errors are also reported to the Error Console , with the document URI (see below) as the source of the error.

剖析 SVG 或 HTML

DOMParser can also be used to parse an SVG document (Firefox 10.0 / Thunderbird 10.0 / SeaMonkey 2.7) or an HTML document (Firefox 12.0 / Thunderbird 12.0 / SeaMonkey 2.9). There are three different results possible, selected by the MIME type given.

If the MIME type is text/xml , the result will be an XMLDocument
If the MIME type is image/svg+xml , the result will be an SVGDocument
If the MIME type is text/html , the result will be an HTMLDocument

let parser = new DOMParser()
let doc = parser.parseFromString(stringContainingXMLSource, "application/xml")
// returns a Document, but not an SVGDocument nor an HTMLDocument
parser = new DOMParser();
doc = parser.parseFromString(stringContainingSVGSource, "image/svg+xml")
// returns a SVGDocument, which also is a Document.
parser = new DOMParser();
doc = parser.parseFromString(stringContainingHTMLSource, "text/html")
// returns an HTMLDocument, which also is a Document.

DOMParser HTML 扩展

/*
 * DOMParser HTML extension
 * 2012-09-04
 *
 * By Eli Grey, http://eligrey.com
 * Public domain.
 * NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
 */
/*! @source https://gist.github.com/1129031 */
/*global document, DOMParser*/
(function(DOMParser) {
	"use strict";
	var proto = DOMParser.prototype,
	nativeParse = proto.parseFromString;
	// Firefox/Opera/IE throw errors on unsupported types
	try {
		// WebKit returns null on unsupported types
		if ((new DOMParser()).parseFromString("", "text/html")) {
			// text/html parsing is natively supported
			return;
		}
	} catch (ex) {}
	proto.parseFromString = function(markup, type) {
		if (/^\s*text\/html\s*(?:;|$)/i.test(type)) {
			var doc = document.implementation.createHTMLDocument("");
				if (markup.toLowerCase().indexOf('<!doctype') > -1) {
					doc.documentElement.innerHTML = markup;
				} else {
					doc.body.innerHTML = markup;
				}
			return doc;
		} else {
			return nativeParse.apply(this, arguments);
		}
	};
}(DOMParser));

规范

规范	状态	注释
HTML 实时标准在该规范中的 DOM parsing 定义。	实时标准

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`DOMParser`	Chrome 1	Edge 12	Firefox 1	IE 9	Opera 8	Safari 3.2	WebView Android 1	Chrome Android 18	Firefox Android 4	Opera Android 10.1	Safari iOS 2	Samsung Internet Android 1.0
`DOMParser()` 构造函数	Chrome 1	Edge 12	Firefox 1	IE 9	Opera 8	Safari 3.2	WebView Android Yes	Chrome Android 18	Firefox Android Yes	Opera Android Yes	Safari iOS ?	Samsung Internet Android 1.0
`parseFromString`	Chrome 1	Edge 12	Firefox 1	IE 9	Opera 8	Safari 3.2	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
`parseFromString` : HTML ( `text/html` ) support	Chrome 31	Edge 12	Firefox 12	IE 10	Opera 17	Safari 9.1	WebView Android 37	Chrome Android 31	Firefox Android 14	Opera Android ?	Safari iOS ?	Samsung Internet Android 3.0
`parseFromString` : SVG ( `image/svg+xml` ) support	Chrome 4	Edge 12	Firefox 10	IE 10	Opera 15	Safari 3.2	WebView Android 37	Chrome Android 18	Firefox Android 10	Opera Android Yes	Safari iOS ?	Samsung Internet Android 1.0
`parseFromString` : XML ( `application/xml` ) support	Chrome 1	Edge 12	Firefox 1	IE 9	Opera 8	Safari 3.2	WebView Android Yes	Chrome Android 18	Firefox Android Yes	Opera Android Yes	Safari iOS ?	Samsung Internet Android 1.0

在此页

句法

方法