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 eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Die editContext-Eigenschaft des HTMLElement-Interfaces ruft das mit einem Element verknüpfte EditContext-Objekt ab und legt es fest.
Die EditContext API kann verwendet werden, um Rich-Text-Editoren im Web zu erstellen, die fortschrittliche Texterfassungserfahrungen unterstützen, wie z.B. die Verwendung von Input Method Editor (IME)-Komposition, Emoji-Auswähler oder jegliche andere plattformspezifische Bearbeitungs-UI-Oberflächen.
Mögliche Elemente
Das Setzen der editContext-Eigenschaft funktioniert nur bei bestimmten Arten von Elementen:
- 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ültiges benutzerdefiniertes Element.
- Ein
<canvas>-Element.
Wenn Sie versuchen, die editContext-Eigenschaft bei einem Element zu setzen, das nicht eines der oben genannten ist, wird ein NotSupportedError DOMException ausgelöst.
Elementverknüpfung
Das Setzen der editContext-Eigenschaft eines Elements auf eine EditContext-Instanz verknüpft dieses Element mit der EditContext-Instanz.
Die Verknüpfung ist eins zu eins:
- Ein Element kann nur mit einer
EditContext-Instanz verknüpft werden. - Eine
EditContext-Instanz kann nur einem Element zugeordnet werden.
Wenn Sie versuchen, eine bereits verknüpfte EditContext-Instanz mit einem anderen Element zu verknüpfen, wird eine DOMException ausgelöst.
Wenn Sie versuchen, eine andere EditContext-Instanz mit einem bereits verknüpften Element zu assoziieren, wird ebenfalls eine DOMException ausgelöst.
Um zu überprüfen, ob ein Element bereits mit einer EditContext-Instanz verknüpft ist, verwenden Sie die Methode EditContext.attachedElements().
Speicherbereinigung
Eine EditContext-Instanz hält ihr zugeordnetes Element am Leben, wenn sie andere aktive Verweise hat, selbst wenn das verknüpfte Element aus dem DOM entfernt wird.
Wenn Sie sicherstellen möchten, dass das Element der Speicherbereinigung unterzogen wird, löschen Sie die editContext-Eigenschaft des Elements.
Wert
Ein EditContext-Objekt oder null.
Beispiele
Setzen der editContext-Eigenschaft eines Elements
Dieses Beispiel zeigt, wie die editContext-Eigenschaft eines <canvas>-Elements auf eine neue EditContext-Instanz gesetzt wird, um das Element bearbeitbar zu machen.
<canvas id="editor-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 die editContext-Eigenschaft eines bearbeitbaren <canvas>-Elements gelöscht wird, um das Element sicher aus dem DOM zu entfernen.
<canvas id="editor-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();
Spezifikationen
| Specification |
|---|
| EditContext API # dom-htmlelement-editcontext |
Browser-Kompatibilität
Siehe auch
- Die
EditContext-Schnittstelle.