MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

The Text.splitText() method breaks the Textnode 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.

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.

Syntax

replacementNode = textnode.splitText(offset)

Example

In this example, a <p> text node will be split into two text nodes and a <span> inserted between them.

<body>
  <p id="p">foobar</p>

  <script type="text/javascript">
    var p = document.getElementById('p');
    var textnode = p.firstChild;

    // split between foo and bar
    var replacementNode = textnode.splitText(3);

    // creating a span with ' span contents '
    var span = document.createElement('span');
    span.appendChild(document.createTextNode(' span contents '));

    // adding the span before 'bar'
    p.insertBefore(span, replacementNode);

    // the result is <p id="p">foo<span> span contents </span>bar</p>
  </script>
</body>

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.		 Recommendation 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.		 Recommendation 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.		 Recommendation Initial definition.

Browser compatibility

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Basic support 1.0 [1] (Yes) 1.0 (1.7 or earlier) (Yes) (Yes) [1] (Yes) [2]
Feature Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (Yes) [1] (Yes) 1.0 (1.0) (Yes) (Yes) [1] (Yes) [2]

[1] Before Chrome 30 and Opera 17, splitText() argument was not mandatory, as required by the specification and implemented by IE and Gecko-based browsers.

[2] The argument is not mandatory, though required by the spec.

See also

Document Tags and Contributors

Tags: 
 Contributors to this page: mattwojo, Jeremie, teoli, kollishivagangadhar, Reachmeatshivam, Sheppy, foolip, Jesse, ethertank, ziyunfei, Rob W, Yanmorin
 Last updated by: mattwojo,