Text: splitText() Methode

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Die splitText() Methode der Text-Schnittstelle teilt den Text-Knoten an der angegebenen Stelle in zwei Knoten auf und behält beide Knoten als Geschwister im Baum bei.

Nach der Teilung enthält der aktuelle Knoten den gesamten Inhalt bis zu der angegebenen Offset-Stelle, und ein neu erstellter Knoten desselben Typs enthält den verbleibenden Text. Der neu erstellte Knoten wird an den Aufrufer zurückgegeben. Wenn der ursprüngliche Knoten ein übergeordnetes Element hatte, wird der neue Knoten als nächster Geschwisterknoten des ursprünglichen Knotens eingefügt. Wenn der Offset gleich der Länge des ursprünglichen Knotens ist, enthält der neu erstellte Knoten keine Daten.

Getrennte Textknoten können mit der Node.normalize()-Methode wieder zusammengeführt werden.

Syntax

js
splitText(offset)

Parameter

offset

Der Index, unmittelbar vor dem der Textknoten geteilt werden soll.

Rückgabewert

Gibt den neu erstellten Text-Knoten zurück, der den Text nach der angegebenen Offset-Stelle enthält.

Ausnahmen

IndexSizeError DOMException

Wird ausgelöst, wenn der angegebene Offset negativ ist oder größer ist als die Anzahl der 16-Bit-Einheiten im Text des Knotens.

NoModificationAllowedError DOMException

Wird ausgelöst, wenn der Knoten schreibgeschützt ist.

Beispiel

In diesem Beispiel wird der Text eines <p> in zwei Textknoten aufgeteilt, und ein <u> wird zwischen ihnen eingefügt.

html
<p>foobar</p>
js
const p = document.querySelector("p");

// Get contents of <p> as a text node
const foobar = p.firstChild;

// Split 'foobar' into two text nodes, 'foo' and 'bar',
// and save 'bar' as a const
const bar = foobar.splitText(3);

// Create a <u> element containing ' new content '
const u = document.createElement("u");
u.appendChild(document.createTextNode(" new content "));

// Add <u> before 'bar'
p.insertBefore(u, bar);

// The result is: <p>foo<u> new content </u>bar</p>

Spezifikationen

Specification
DOM
# ref-for-dom-text-splittext①

Browser-Kompatibilität

Siehe auch

  • Die Text-Schnittstelle, zu der sie gehört.
  • Die entgegengesetzte Methode: Node.normalize.