javascript check if child node is element or text node

You can check if a given child node is a text node or not using the nodeType. Text nodes will have the nodeType as 3. We can either use the number or the constant Node.TEXT_NODE for checking.

window.onload = function() {
  var el = document.getElementsByTagName('ol')[0].childNodes; // using [0] as there is only one ol in the demo
  console.log('Print with text nodes');
  for (let i = 0; i < el.length; i++) { // will output all nodes with "undefined" for text nodes
    console.log(el[i].innerHTML);
  }
  console.log('Print without text nodes');
  for (var i = 0; i < el.length; i++) { // will output only non text nodes.
    if (el[i].nodeType !== Node.TEXT_NODE) // or if (el[i].nodeType !== 3)
      console.log(el[i].innerHTML);
  }
}
<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Coca Cola</li>
</ol>

Leave a Comment