DOMImplementation.createDocument() — Methode · JavaScript-Referenz

Signatur

DOMImplementation.prototype.createDocument(namespaceURI, qualifiedName, doctype)

Beschreibung

createDocument() wird über document.implementation aufgerufen und erzeugt ein komplett neues, vom aktuellen Dokument unabhängiges XMLDocument. Wenn Sie einen qualifizierten Namen angeben, legt die Methode gleich das Wurzelelement im angegebenen Namensraum an. Mit einem optionalen DocumentType (aus createDocumentType()) bekommt das Dokument außerdem eine Doctype-Deklaration.

Praktisch ist die Methode, wenn Sie XML-Daten programmatisch aufbauen wollen, etwa für SOAP-/XML-Anfragen, RSS- oder Atom-Feeds, SVG-Dateien zum Herunterladen oder Konfigurationsdateien. Das fertige Dokument wandeln Sie mit XMLSerializer in einen String um. Das ist sicherer, als XML per String-Verkettung zusammenzubauen, denn Sonderzeichen in Text und Attributen werden beim Serialisieren automatisch maskiert.

Für HTML-Dokumente gibt es createHTMLDocument(). Soll vorhandener XML-Text eingelesen werden, ist DOMParser.parseFromString() die bessere Wahl.

Parameter

Name	Typ	Default	Beschreibung
$namespaceURI Pflicht	string\|null		Namensraum-URI des Wurzelelements, z. B. `"http://www.w3.org/2000/svg"`. Bei `null` oder `""` liegt das Element in keinem Namensraum.
$qualifiedName Pflicht	string\|null		Qualifizierter Name des Wurzelelements, auch mit Präfix (z. B. `"atom:feed"`). Bei `null` oder `""` wird kein Wurzelelement erzeugt.
$doctype	DocumentType\|null	null	Optionaler Doctype, erzeugt mit `document.implementation.createDocumentType()`.

Rückgabewert

Typ

XMLDocument

Beschreibung

Das neu erzeugte XMLDocument. Wurde ein Name angegeben, ist das Wurzelelement über documentElement erreichbar.

Beispiele

Einfaches XML-Dokument erzeugen und serialisieren

const xmlDoc = document.implementation.createDocument(null, 'bestellung', null);
const root = xmlDoc.documentElement;

const artikel = xmlDoc.createElement('artikel');
artikel.setAttribute('id', '42');
artikel.textContent = 'Kaffee & Kuchen';
root.appendChild(artikel);

console.log(new XMLSerializer().serializeToString(xmlDoc));

<bestellung><artikel id="42">Kaffee & Kuchen</artikel></bestellung>

SVG-Datei erzeugen und zum Download anbieten

const SVG_NS = 'http://www.w3.org/2000/svg';
const svgDoc = document.implementation.createDocument(SVG_NS, 'svg', null);
const svg = svgDoc.documentElement;
svg.setAttribute('width', '100');
svg.setAttribute('height', '100');

const circle = svgDoc.createElementNS(SVG_NS, 'circle');
circle.setAttribute('cx', '50');
circle.setAttribute('cy', '50');
circle.setAttribute('r', '40');
circle.setAttribute('fill', 'tomato');
svg.appendChild(circle);

const xml = new XMLSerializer().serializeToString(svgDoc);
const url = URL.createObjectURL(new Blob([xml], { type: 'image/svg+xml' }));
const a = Object.assign(document.createElement('a'), { href: url, download: 'kreis.svg' });
a.click();
URL.revokeObjectURL(url);

Dokument mit Doctype und Namensraum-Präfix

const impl = document.implementation;
const doctype = impl.createDocumentType('feed', '', '');
const ATOM_NS = 'http://www.w3.org/2005/Atom';
const feedDoc = impl.createDocument(ATOM_NS, 'atom:feed', doctype);

const title = feedDoc.createElementNS(ATOM_NS, 'atom:title');
title.textContent = 'Mein Blog';
feedDoc.documentElement.appendChild(title);

console.log(feedDoc.doctype.name);
console.log(feedDoc.documentElement.namespaceURI);
console.log(new XMLSerializer().serializeToString(feedDoc));

feed http://www.w3.org/2005/Atom <!DOCTYPE feed><atom:feed xmlns:atom="http://www.w3.org/2005/Atom"><atom:title>Mein Blog</atom:title></atom:feed>

// Wichtig · Fallstricke

Namensraum weitergeben: Kindelemente erben den Namensraum der Wurzel nicht. Legen Sie sie mit createElementNS() an. Ein createElement() in einem XML-Dokument erzeugt ein Element ohne Namensraum, das bei der Ausgabe z. B. xmlns=\"\" bekommt.
Ausnahmen: Bei einem ungültigen qualifiedName wird ein InvalidCharacterError ausgelöst. Ein NamespaceError entsteht, wenn ein Präfix ohne Namensraum angegeben wird oder xml/xmlns falsch verwendet werden.
Kein Wurzelelement: Mit qualifiedName = \"\" ist documentElement gleich null. Das Wurzelelement müssen Sie dann selbst anhängen.
Content-Type: Der contentType des Dokuments hängt vom Namensraum ab: application/xhtml+xml bei XHTML, image/svg+xml bei SVG, sonst application/xml.
Fremdes Dokument: Knoten aus dem neuen Dokument müssen Sie vor dem Einfügen ins Seiten-DOM mit document.importNode() oder adoptNode() übernehmen.
Kompatibilität: Wird von allen modernen Browsern unterstützt. In Node.js gibt es die Methode nur mit DOM-Bibliotheken wie jsdom oder @xmldom/xmldom.

Siehe auch

DOMImplementation DOMImplementation.createHTMLDocument() DOMImplementation.createDocumentType() XMLDocument XMLSerializer DOMParser.parseFromString() Document.createElementNS() Document.importNode()