Text.splitText()

Estás leyendo la versión en inglés del artículo porque aún no existe una traducción para este idioma. ¡Ayúdanos a traducir este artículo!

The Text.splitText() method breaks the Text node into two nodes at the specified offset, keeping both nodes in the tree as siblings.

After the split, the current node contains all the content up to the specified offset point, and a newly created node of the same type contains the remaining text. The newly created node is returned to the caller. If the original node had a parent, the new node is inserted as the next sibling of the original node. If the offset is equal to the length of the original node, the newly created node has no data.

Separated text nodes can be concatenated using the Node.normalize() method.

Syntax

newNode = textNode.splitText(offset)

Parameters

offset
The index immediately before which to break the text node.

Return value

Returns a newly created Text node that contains the text after the specified offset point.

Exceptions thrown

A DOMException with a value of INDEX_SIZE_ERR is thrown if the specified offset is negative or is greater than the number of 16-bit units in the node's text; a DOMException with a value of NO_MODIFICATION_ALLOWED_ERR is thrown if the node is read-only.

Example

In this example, the text of a <p> is split into two text nodes, and a <u> is inserted between them.

HTML

<p>foobar</p>

JavaScript

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>

Result

Specifications

Specification Status Comment
DOM
The definition of 'Text.splitText' in that specification.
Living Standard No change from Document Object Model (DOM) Level 3 Core Specification.
Document Object Model (DOM) Level 3 Core Specification
The definition of 'Text.splitText' in that specification.
Obsolete No change from Document Object Model (DOM) Level 2 Core Specification.
Document Object Model (DOM) Level 2 Core Specification
The definition of 'Text.splitText' in that specification.
Obsolete No change from Document Object Model (DOM) Level 1 Specification.
Document Object Model (DOM) Level 1 Specification
The definition of 'Text.splitText' in that specification.
Obsolete Initial definition.

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
splitTextChrome Full support 1
Notes
Full support 1
Notes
Notes Before Chrome 30, the offset argument was optional.
Edge Full support 12Firefox Full support 1IE Full support YesOpera Full support Yes
Notes
Full support Yes
Notes
Notes Before Opera 17, the offset argument was optional.
Safari Full support Yes
Notes
Full support Yes
Notes
Notes The offset argument is optional.
WebView Android Full support Yes
Notes
Full support Yes
Notes
Notes Before version 4.4, the offset argument was optional.
Chrome Android Full support 18
Notes
Full support 18
Notes
Notes Before Chrome 30, the offset argument was optional.
Firefox Android Full support 4Opera Android Full support Yes
Notes
Full support Yes
Notes
Notes Before Opera 17, the offset argument was optional.
Safari iOS Full support Yes
Notes
Full support Yes
Notes
Notes The offset argument is optional.
Samsung Internet Android ?

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.

See also