DocumentType.after() — Methode · JavaScript-Referenz

Signatur

DocumentType.prototype.after(...nodes)

Beschreibung

after() gehört zum Mixin ChildNode und steht deshalb auch auf DocumentType-Knoten zur Verfügung, also z. B. auf document.doctype. Die Methode nimmt beliebig viele Knoten oder Zeichenketten entgegen und fügt sie in der angegebenen Reihenfolge direkt hinter dem Doctype in den Elternknoten ein. In der Regel ist das das Document selbst. Zeichenketten werden dabei automatisch in Text-Knoten umgewandelt.

Beim Doctype ist das aber nur begrenzt nützlich, denn der Elternknoten ist fast immer ein Document. Ein Dokument darf keine Textknoten und höchstens ein Element als direkte Kinder haben. Praktisch sinnvoll sind deshalb vor allem:

Comment-Knoten, z. B. für Kommentare mit Build- oder Lizenzinformationen direkt nach dem Doctype,
ProcessingInstruction-Knoten in XML-Dokumenten,
das Wurzelelement in einem Dokument, das Sie selbst per document.implementation.createDocument() erzeugt haben und das noch kein Wurzelelement hat.

Knoten, die schon an anderer Stelle im DOM hängen, werden verschoben und nicht kopiert. Wenn Sie ein DocumentFragment übergeben, wird dessen Inhalt eingefügt. Hat der Doctype keinen Elternknoten, passiert nichts.

Parameter

Name	Typ	Default	Beschreibung
$...nodes	Node \| string		Beliebig viele Knoten oder Zeichenketten, die hinter dem Doctype eingefügt werden. Zeichenketten werden zu `Text`-Knoten. Unter einem `Document` als Elternknoten führt das allerdings zu einem Fehler.

Rückgabewert

Typ

void

Beschreibung

Gibt undefined zurück.

Beispiele

Kommentar direkt nach dem Doctype einfügen

const doctype = document.doctype;

if (doctype) {
  const hinweis = document.createComment(' Build: 2024-05-01, Version 3.2.1 ');
  doctype.after(hinweis);
  console.log(doctype.nextSibling.nodeType === Node.COMMENT_NODE);
  console.log(doctype.nextSibling.nodeValue);
}

true Build: 2024-05-01, Version 3.2.1

Wurzelelement in ein neu erzeugtes XML-Dokument einfügen

const doctype = document.implementation.createDocumentType('note', '', 'note.dtd');
// Dokument ohne Wurzelelement erzeugen
const xmlDoc = document.implementation.createDocument(null, '', doctype);

const root = xmlDoc.createElement('note');
root.textContent = 'Hallo Welt';

// Wurzelelement direkt hinter dem Doctype einfügen
doctype.after(root);

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

<!DOCTYPE note SYSTEM "note.dtd"><note>Hallo Welt</note>

Fallstrick: Zeichenketten unter dem Document

try {
  // Die Zeichenkette wird zu einem Textknoten, und der ist direkt unter Document nicht erlaubt
  document.doctype.after('Etwas Text');
} catch (err) {
  console.log(err.name);
}

HierarchyRequestError

// Wichtig · Fallstricke

HierarchyRequestError: Diesen Fehler wirft die Methode, wenn das Einfügen gegen die DOM-Regeln verstößt. Typische Fälle sind Zeichenketten bzw. Textknoten direkt unter Document, ein zweites Element, wenn es schon ein <html>-Element gibt, oder ein zweiter Doctype.
Kein Doctype vorhanden: Fehlt die Doctype-Deklaration (dann läuft die Seite im Quirks-Modus), ist document.doctype gleich null und der Aufruf wirft einen TypeError. Prüfen Sie das vorher oder verwenden Sie document.doctype?.after(...).
Ohne Elternknoten: Bei einem losgelösten Doctype, z. B. frisch aus createDocumentType(), bewirkt der Aufruf nichts.
Verschieben statt Kopieren: Knoten, die schon im DOM hängen, werden verschoben. Für eine Kopie verwenden Sie vorher cloneNode(true).
Kompatibilität: Wird in allen aktuellen Browsern unterstützt. Der Internet Explorer kennt die Methode nicht; dort bleibt nur parentNode.insertBefore(node, doctype.nextSibling).

Siehe auch

DocumentType.before() DocumentType.replaceWith() DocumentType.remove() Element.after() Node.insertBefore() Document.doctype DocumentType