Text: Methode splitText()

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 auf, wobei beide Knoten im Baum als Geschwister verbleiben.

Nach der Teilung enthält der aktuelle Knoten alle Inhalte bis zu der angegebenen Offset-Stelle, und ein neu erstellter Knoten desselben Typs enthält den restlichen Text. Der neu erstellte Knoten wird dem Aufrufer zurückgegeben. Wenn der ursprüngliche Knoten ein übergeordnetes Element hatte, wird der neue Knoten als nächstes Geschwister des ursprünglichen Knotens eingefügt. Wenn der Offset gleich der Länge des ursprünglichen Knotens ist, hat der neu erstellte Knoten keine Daten.

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

Syntax

js
newNode = textNode.splitText(offset)

Parameter

offset

Der Index unmittelbar vor der Stelle, an der 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 als die Anzahl der 16-Bit-Einheiten im Text des Knotens ist.

NoModificationAllowedError DOMException

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

Beispiel

In diesem Beispiel wird der Text eines <p> in zwei Textknoten geteilt und ein <u> dazwischen 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 Standard
# ref-for-dom-text-splittext①

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch

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