HTMLElement: editContext Eigenschaft

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimentell:Dies ist eineexperimentelle Technologie
Überprüfen Sie dieBrowser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

DieeditContext-Eigenschaft derHTMLElement-Schnittstelle erhält und setzt das einem Element zugeordneteEditContext-Objekt.

DieEditContext API kann verwendet werden, um Rich-Text-Editoren im Web zu erstellen, die fortgeschrittene Textein- und -ausgabeerfahrungen unterstützen, wie z.B. die Komposition mit demInput Method Editor (IME), Emoji-Auswahl oder andere plattformabhängige, bearbeitungsbezogene Benutzeroberflächen.

Wert

EinEditContext-Objekt odernull.

Mögliche Elemente

Das Setzen dereditContext-Eigenschaft funktioniert nur bei bestimmten Elementtypen:

Eines dieser HTML-Elemente:<article>,<aside>,<blockquote>,<body>,<div>,<footer>,<h1>,<h2>,<h3>,<h4>,<h5>,<h6>,<header>,<main>,<nav>,<p>,<section>, oder<span>.
Ein gültigesbenutzerdefiniertes Element.
Ein<canvas>-Element.

Wenn Sie versuchen, dieeditContext-Eigenschaft für ein Element festzulegen, das nicht zu den oben genannten gehört, wird einNotSupportedError-DOMException ausgelöst.

Elementassoziation

Das Setzen dereditContext-Eigenschaft eines Elements auf eineEditContext-Instanz ordnet dieses Element derEditContext-Instanz zu.

Die Zuordnung ist eins-zu-eins:

Ein Element kann nur mit einerEditContext-Instanz verknüpft werden.
EineEditContext-Instanz kann nur einem Element zugeordnet werden.

Wenn Sie versuchen, eine bereits zugeordneteEditContext-Instanz einem anderen Element zuzuordnen, wird einDOMException ausgelöst.

Wenn Sie versuchen, eine andereEditContext-Instanz mit einem Element zu verknüpfen, das bereits zugeordnet ist, wird ebenfalls eineDOMException ausgelöst.

Um zu überprüfen, ob ein Element bereits mit einerEditContext-Instanz verknüpft ist, verwenden Sie die MethodeEditContext.attachedElements().

<canvas></canvas>

const canvas = document.getElementById("editor-canvas");const editContext = new EditContext();canvas.editContext = editContext;

Löschen der`editContext`-Eigenschaft eines Elements

Dieses Beispiel zeigt, wie dieeditContext-Eigenschaft eines bearbeitbaren<canvas>-Elements gelöscht wird, um das Element sicher aus dem DOM zu entfernen.

html

<canvas></canvas>

// Create the EditContext and associate it with the canvas element.const canvas = document.getElementById("editor-canvas");const editContext = new EditContext();canvas.editContext = editContext;// Later, clear the editContext property, and remove the element.canvas.editContext = null;canvas.remove();