HTMLTemplateElement: content-Eigenschaft

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit November 2015 browserübergreifend verfügbar.

Die content-Eigenschaft des HTMLTemplateElement-Interfaces gibt den Inhalt des <template>-Elements als ein DocumentFragment zurück. Das ownerDocument dieses Inhalts ist ein separates Document von demjenigen, das das <template>-Element selbst enthält — es sei denn, das enthaltende Dokument wurde eigens für den Zweck erstellt, Template-Inhalte zu halten.

Die Methoden Node.cloneNode() und Document.importNode() erstellen beide eine Kopie eines Knotens. Der Unterschied ist, dass importNode() den Knoten im Kontext des aufrufenden Dokuments klont, während cloneNode() das Dokument des zu klonenden Knotens verwendet. Der Dokumentkontext bestimmt das CustomElementRegistry für die Konstruktion von benutzerdefinierten Elementen. Aus diesem Grund sollte document.importNode() verwendet werden, um das content-Fragment zu klonen, damit benutzerdefinierte Element-Nachkommen mithilfe der Definitionen im aktuellen Dokument und nicht dem separaten Dokument, das den Template-Inhalt besitzt, konstruiert werden. Weitere Details finden Sie in den Beispielen auf der Seite zu Node.cloneNode().

In diesem Artikel

Wert

Ein DocumentFragment.

Beispiele

Verwendung von importNode() mit Template-Inhalten

js
const templateElement = document.querySelector("#foo");
const documentFragment = document.importNode(templateElement.content, true);
// Now you can insert the documentFragment into the DOM

Das ownerDocument von Template-Inhalten

Für <template>-Elemente, die im Kontext eines normalen HTML-Dokuments erstellt werden, ist das ownerDocument des content ein separates, neu erstelltes Dokument:

js
const template = document.createElement("template");
console.log(template.content.ownerDocument === document); // false
console.log(template.content.ownerDocument.URL); // "about:blank"

Wenn das <template>-Element im Kontext eines Dokuments erstellt wird, das selbst für den Zweck des Haltens von Template-Inhalten erstellt wurde, dann ist das ownerDocument des content dasselbe wie das des enthaltenden Dokuments:

js
const template1 = document.createElement("template");
const docForTemplate = template1.content.ownerDocument;
const template2 = docForTemplate.createElement("template");
console.log(template2.content.ownerDocument === docForTemplate); // true

HTMLTemplateElement

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

Web Components
HTMLTemplateElement
Instanzeigenschaften
Vererbung
Verwandte Seiten für Web Components
Anleitungen
1. Verwenden von benutzerdefinierten Elementen
2. Verwenden von Shadow DOM
3. Verwendung von Templates und Slots