The Node.textContent property represents the text content of a node and its descendants. However, it is very different from the confusable innerText property.


var text = element.textContent;
element.textContent = "this is some sample text";


  • textContent returns null if the node is a document, a DOCTYPE, or a notation. To grab all of the text and CDATA data for the whole document, one could use document.documentElement.textContent.
  • If the node is a CDATA section, comment, processing instruction, or text node, textContent returns the text inside this node (the nodeValue).
  • For other node types, textContent returns the concatenation of the textContent of every child node, excluding comments and processing instructions. This is an empty string if the node has no children.
  • Setting this property on a node removes all of its children and replaces them with a single text node with the given value.

Differences from innerText

Internet Explorer introduced node.innerText. The name is similar but with the following differences:

  • While textContent gets the content of all elements, including <script> and <style> elements, innerText does not, only showing “human-readable” elements.
  • innerText is aware of styling and won’t return the text of “hidden” elements, whereas textContent does.
  • Since innerText takes into account CSS styling, reading this property triggers a reflow, ensuring up-to-date computed style. textContent doesn’t. Reflows can be computationally expensive thus should be avoided when possible.
  • Unlike textContent, altering innerText in Internet Explorer (version 11 and below) removes child nodes from the element and permanently destroys all descendant text nodes. It is impossible to insert the nodes again into any other element or into the same element anymore.

Differences from innerHTML

Element.innerHTML returns HTML as its name indicates. Sometimes people use innerHTML to retrieve or write text inside an element. textContent has better performance because its value is not parsed as HTML. Moreover, using textContent can prevent XSS attacks.


// Given the following HTML fragment:
//   <div id="divA">This is <span>some</span> text</div>

// Get the text content:
var text = document.getElementById("divA").textContent;
// |text| is set to "This is some text".

// Set the text content:
document.getElementById("divA").textContent = "This is some text";
// The HTML for divA is now:
//   <div id="divA">This is some text</div>

Polyfill for IE8

// Source: Eli Grey @
if (Object.defineProperty 
  && Object.getOwnPropertyDescriptor 
  && Object.getOwnPropertyDescriptor(Element.prototype, "textContent") 
  && !Object.getOwnPropertyDescriptor(Element.prototype, "textContent").get) {
  (function() {
    var innerText = Object.getOwnPropertyDescriptor(Element.prototype, "innerText");
    Object.defineProperty(Element.prototype, "textContent",
     // Passing innerText or innerText.get directly does not work,
     // wrapper function is required.
       get: function() {
       set: function(s) {
         return, s);

Browser compatibility

Update compatibility data on GitHub
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Basic supportChrome Full support YesEdge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support 3WebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS ? Samsung Internet Android Full support Yes


Full support  
Full support
Compatibility unknown  
Compatibility unknown


Specification Status Comment
The definition of 'Node.textContent' in that specification.
Living Standard No change vs. DOM4
The definition of 'Node.textContent' in that specification.
Document Object Model (DOM) Level 3 Core Specification
The definition of 'Node.textContent' in that specification.
Obsolete Introduced

See also