CharacterData.deleteData() — Methode · JavaScript-Referenz

Signatur

CharacterData.prototype.deleteData(offset, count)

Beschreibung

Die Methode deleteData() der Schnittstelle CharacterData ändert den Textinhalt eines Knotens direkt an Ort und Stelle: Ab dem Index offset werden count Zeichen entfernt. Sie steht auf allen von CharacterData abgeleiteten Knoten zur Verfügung, also auf Text, Comment, CDATASection und ProcessingInstruction.

Im Unterschied zu einer Neuzuweisung von node.data oder textContent bleibt der Knoten selbst erhalten. Außerdem werden aktive Range-Objekte (z. B. die Auswahl des Nutzers) korrekt angepasst, und ein MutationObserver meldet eine einzige characterData-Mutation. Das ist nützlich bei Editoren, Syntax-Hervorhebung oder allen Fällen, in denen Teile eines Textes gezielt entfernt werden sollen, ohne das umgebende DOM neu aufzubauen.

Reicht offset + count über das Ende des Textes hinaus, wird einfach bis zum Ende gelöscht. Ist offset jedoch größer als die Länge des Textes, wird ein IndexSizeError (DOMException) geworfen.

Parameter

Name	Typ	Default	Beschreibung
$offset Pflicht	number		Nullbasierter Index (in UTF-16-Codeeinheiten), ab dem gelöscht wird. Darf höchstens `length` sein.
$count Pflicht	number		Anzahl der zu entfernenden Codeeinheiten. Überschreitet `offset + count` die Länge, wird bis zum Textende gelöscht.

Beispiele

Teil eines Textknotens entfernen

const p = document.createElement('p');
p.textContent = 'Hallo schöne Welt';
const text = p.firstChild;

// "schöne " (7 Zeichen) ab Index 6 entfernen
text.deleteData(6, 7);
console.log(text.data);

Hallo Welt

Bis zum Ende löschen, wenn count zu groß ist

const text = document.createTextNode('Preis: 49,99 € inkl. MwSt.');

// Alles ab Index 14 abschneiden – count darf größer sein als der Rest
text.deleteData(14, Number.MAX_SAFE_INTEGER);
console.log(JSON.stringify(text.data));

"Preis: 49,99 €"

Fehlerbehandlung bei ungültigem offset

const comment = document.createComment('TODO');

try {
  comment.deleteData(10, 2); // offset > length (4)
} catch (err) {
  console.log(err.name);
}

IndexSizeError

Mutation mit MutationObserver beobachten

const text = document.createTextNode('abcdef');
document.body.append(text);

const observer = new MutationObserver((records) => {
  for (const r of records) {
    console.log(r.type, r.oldValue, '→', r.target.data);
  }
});
observer.observe(text, { characterData: true, characterDataOldValue: true });

text.deleteData(1, 3);

characterData abcdef → aef

// Wichtig · Fallstricke

UTF-16-Codeeinheiten: offset und count zählen Codeeinheiten, nicht sichtbare Zeichen. Emojis oder andere Zeichen außerhalb der BMP belegen zwei Einheiten – wer mitten in ein Surrogatpaar löscht, erzeugt kaputte Zeichen (z. B. „�“).
IndexSizeError: Wird nur geworfen, wenn offset > length. Ein zu großer count ist dagegen erlaubt.
Negative Werte: Die Argumente werden zu unsigned long konvertiert; -1 wird so zu 4294967295 – als count löscht das bis zum Ende, als offset führt es zu einem IndexSizeError.
Nur auf CharacterData-Knoten verfügbar – nicht auf Elementen. Bei einem Element zuerst den Textknoten ermitteln (z. B. el.firstChild).
Wird von allen Browsern seit Jahren unterstützt und funktioniert auch in DOM-Implementierungen wie jsdom.

Siehe auch

CharacterData CharacterData.insertData() CharacterData.replaceData() CharacterData.substringData() CharacterData.appendData() CharacterData.data Text.splitText()