DOMParser

L'interface DOMParser permet d'analyser le code source XML ou HTML  à partir d'une chaîne dans un Document DOM.

Vous pouvez effectuer l'opération inverse - convertir un arbre DOM en source XML ou HTML - en utilisant l'interface XMLSerializer.

Dans le cas d'un document HTML, vous pouvez également remplacer des parties du DOM par de nouveaux arbres DOM construits à partir de HTML en définissant la valeur de Element.innerHTML et des propriétés outerHTML. Ces propriétés peuvent également être lues pour récupérer des fragments HTML liés à la sous-arborescence DOM correspondante.

Création d'un DOMParser

Pour créer un objet DOMParser, utilisez simplement DOMParser().

Analyse XML

Une fois que vous avez créé un objet d'analyse, vous pouvez analyser XML à partir d'une chaîne à l'aide de la méthode parseFromString() :

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

Gestion d'erreurs

Notez que si le processus de traitement échoue, DOMParser ne génère aucune exception mais retourne à la place un document d'erreur :

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

Les erreurs d'analyse sont aussi renvoyées à la console d'erreur, avec l'URI du document (voir plus bas) comme la source d'erreur.

Analyse d'un document SVG ou HTML

Le DOMParser peut également être utilisé pour analyser un document SVG (Firefox 10.0 / Thunderbird 10.0 / SeaMonkey 2.7) ou un document HTML (Firefox 12.0 / Thunderbird 12.0 / SeaMonkey 2.9). Trois résultats différents sont possibles, sélectionnés par le type MIME donné. Si le type MIME est text/xml, l'objet résultant sera un XMLDocument, si le type MIME est image/svg + xml, ce sera un SVGDocument et si le type MIME est text/html, ce sera un HTMLDocument.

var parser = new DOMParser();
var doc = parser.parseFromString(stringContainingXMLSource, "application/xml");
// retourne un document, mais pas un SVGDocument ni un HTMLDocument

parser = new DOMParser();
doc = parser.parseFromString(stringContainingSVGSource, "image/svg+xml");
// retourne un SVGDocument, qui est aussi un document.

parser = new DOMParser();
doc = parser.parseFromString(stringContainingHTMLSource, "text/html");
// retourne un HTMLDocument, qui est aussi un document.

Extension HTML DOMParser pour les autres navigateurs

/*
 * DOMParser HTML extension
 * 2012-09-04
 * 
 * By Eli Grey, http://eligrey.com
 * Public domain.
 * AUCUNE GARANTIE EXPRESSE OU IMPLICITE. À UTILISER À VOS RISQUES ET PÉRILS. 
 */

/*! @source https://gist.github.com/1129031 */
/*global document, DOMParser*/

(function(DOMParser) {
	"use strict";

	var proto = DOMParser.prototype, 
        nativeParse = proto.parseFromString;

	// Firefox/Opera/IE lancent des erreurs sur les types non pris en charge 
	try {
		//  WebKit renvoie null sur les types non pris en charge 
		if ((new DOMParser()).parseFromString("", "text/html")) {
			// text/html l'analyse est supportée nativement 
			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));

Spécifications

Compatibilité des navigateurs

Nous convertissons les données de compatibilité dans un format JSON. Ce tableau de compatibilité utilise encore l'ancien format car nous n'avons pas encore converti les données qu'il contient. Vous pouvez nous aider en contribuant !