Text: wholeText property
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.
The read-only wholeText property of the Text interface
returns the full text of all Text nodes logically adjacent to the node.
The text is concatenated in document order.
This allows specifying any text node and obtaining all adjacent text as a single string.
Note:
This is similar to calling Node.normalize() followed by reading the text value,
but without modifying the tree.
Value
A string with the concatenated text.
Example
Suppose you have the following simple paragraph within your webpage:
<p>
Through-hiking is great!
<strong>No insipid election coverage!</strong> However,
<a href="https://en.wikipedia.org/wiki/Absentee_ballot">casting a ballot</a>
is tricky.
</p>
You decide you don't like the middle sentence, so you remove it:
const paragraph = document.querySelector("p"); // Reads the paragraph
paragraph.removeChild(paragraph.childNodes[1]); // Delete the strong element
Now you end up with "Through-hiking is great! However, casting a ballot is tricky.", with two nodes before the hyperlink:
- A
Textcontaining the string"Through-hiking is great!" - A second
Textnode containing the string" However, "
To get those two nodes at once, you would call paragraph.childNodes[0].wholeText:
console.log(`'${paragraph.childNodes[0].wholeText}'`); // 'Through-hiking is great! However, '
Specifications
| Specification |
|---|
| DOM # ref-for-dom-text-wholetext① |
Browser compatibility
| desktop | mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
wholeText
|
|
|
|
|
|
|
|
|
|
|
|
|
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
See also
- The
Textinterface it belongs to.