Start · Sprachen · JavaScript · Referenz · DocumentType

DocumentType

Schnittstelle

Stellt den <code>&lt;!DOCTYPE&gt;</code>-Knoten eines Dokuments dar und gibt Zugriff auf dessen Namen, öffentliche und System-Kennung.

seit JavaScript Baseline: alle Browser (DOM Level 1; ChildNode-Met Kategorie: webapi

Signatur

interface DocumentType extends Node

Beschreibung

Die Schnittstelle DocumentType steht für die Dokumenttyp-Deklaration (<!DOCTYPE …>) eines HTML- oder XML-Dokuments. Sie erbt von Node. Ihr nodeType ist 10 (Node.DOCUMENT_TYPE_NODE), und nodeName entspricht dem Doctype-Namen, bei HTML5 also "html". Den Doctype des aktuellen Dokuments erreichen Sie über document.doctype. Gibt es keinen, ist der Wert null.

Die Schnittstelle hat drei schreibgeschützte Eigenschaften:

  • name: der Name des Doctypes, z. B. "html" oder "svg".
  • publicId: die öffentliche Kennung, z. B. "-//W3C//DTD XHTML 1.0 Strict//EN". Bei <!DOCTYPE html> ist das ein leerer String.
  • systemId: die System-Kennung, meist die URL der DTD. Bei HTML5 ebenfalls ein leerer String.

Außerdem bietet DocumentType die ChildNode-Methoden before(), after(), replaceWith() und remove(). Einen Konstruktor gibt es nicht. Neue Doctype-Knoten erzeugen Sie mit document.implementation.createDocumentType(qualifiedName, publicId, systemId). Die unten genannten Parameter gehören zu dieser Fabrikmethode.

In der Praxis brauchen Sie DocumentType vor allem in drei Fällen: wenn Sie ein Dokument vollständig serialisieren (z. B. für Export oder Vorschau), wenn Sie beim Erzeugen neuer Dokumente per createDocument() einen Doctype mitgeben, und wenn Sie herausfinden wollen, ob eine Seite im Standard- oder im Quirks-Modus läuft.

Parameter

Name Typ Default Beschreibung
$qualifiedName Pflicht string Parameter von DOMImplementation.createDocumentType(): Name des Doctypes, z. B. "html" oder "svg:svg". Wird später als name zurückgegeben.
$publicId Pflicht string Öffentliche Kennung der DTD. Für HTML5 einen leeren String "" übergeben.
$systemId Pflicht string System-Kennung, meist die URL der DTD. Für HTML5 einen leeren String "" übergeben.

Rückgabewert

Typ
DocumentType
Beschreibung
createDocumentType() gibt einen neuen DocumentType-Knoten zurück, der noch keinem Dokument angehört. document.doctype liefert den vorhandenen Knoten oder null.

Beispiele

Doctype des aktuellen Dokuments auslesen

const dt = document.doctype;

if (dt) {
  console.log(dt.name);       // Name des Doctypes
  console.log(dt.publicId);   // bei HTML5 leer
  console.log(dt.systemId);   // bei HTML5 leer
  console.log(dt.nodeType === Node.DOCUMENT_TYPE_NODE);
} else {
  console.log('Kein Doctype – Seite läuft vermutlich im Quirks-Modus');
}
console.log(document.compatMode);
html true CSS1Compat

Vollständiges HTML inklusive Doctype serialisieren

const serializeDocument = (doc) => {
  const doctype = doc.doctype
    ? new XMLSerializer().serializeToString(doc.doctype)
    : '';
  return `${doctype}\n${doc.documentElement.outerHTML}`;
};

// outerHTML allein enthält den Doctype NICHT
const html = serializeDocument(document);
console.log(html.slice(0, 15));
<!DOCTYPE html>

Neues XHTML-Dokument mit eigenem Doctype erzeugen

const impl = document.implementation;
const doctype = impl.createDocumentType(
  'html',
  '-//W3C//DTD XHTML 1.0 Strict//EN',
  'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'
);

const xhtmlDoc = impl.createDocument(
  'http://www.w3.org/1999/xhtml',
  'html',
  doctype
);

console.log(xhtmlDoc.doctype === doctype);
console.log(xhtmlDoc.doctype.publicId);
true -//W3C//DTD XHTML 1.0 Strict//EN

Fehlenden Doctype in einem geparsten Dokument ergänzen

const parsed = new DOMParser().parseFromString('<p>Hallo</p>', 'text/html');
console.log(parsed.doctype, parsed.compatMode);

const html5Doctype = parsed.implementation.createDocumentType('html', '', '');
// Der Doctype muss vor dem Wurzelelement stehen
parsed.insertBefore(html5Doctype, parsed.documentElement);

console.log(parsed.doctype.name);
null BackCompat html

// Wichtig · Fallstricke

  • Kein Konstruktor: new DocumentType() löst einen TypeError aus. Verwenden Sie stattdessen document.implementation.createDocumentType().
  • outerHTML enthält keinen Doctype: document.documentElement.outerHTML liefert nur das <html>-Element. Den Doctype müssen Sie separat serialisieren, z. B. mit XMLSerializer.
  • Nachträgliches Einfügen ändert den Rendering-Modus nicht: Der Quirks-Modus (document.compatMode === "BackCompat") wird beim Parsen festgelegt. Ein per Skript eingefügter oder entfernter Doctype schaltet ihn nicht um.
  • Position im Baum: Ein Dokument darf nur einen Doctype haben, und er muss vor dem Wurzelelement stehen. Sonst wirft insertBefore() bzw. appendChild() einen HierarchyRequestError.
  • Entfernte Eigenschaften: entities, notations und internalSubset wurden aus der Spezifikation gestrichen und sind in aktuellen Browsern nicht mehr verfügbar. Verlassen Sie sich nicht darauf.
  • textContent und nodeValue sind bei DocumentType immer null.
  • Kompatibilität: name, publicId und systemId funktionieren in allen Browsern. Die ChildNode-Methoden (remove(), before() usw.) gibt es in allen modernen Browsern, im Internet Explorer jedoch nicht.