JavaScript get textContent excluding children

user_5581893 0
Viewed 6422

First, I'm creating a library for JavaScript and I can not use jQuery. I'm trying to get the text content of an HTML element without the text contents of its children.

Both attributes innerText and textContent don't give me what needed, please help.

shared-libraries html javascript
5 Answers

Using only JavaScript (you specified you cannot use jQuery), and given that you have provided and know the id for the parent element:

document.getElementById('parent_element_id').childNodes[0].nodeValue;

You can also use .trim() to remove any trailing space characters left behind from the removal of any child element text:

document.getElementById('parent_element_id').childNodes[0].nodeValue.trim();
user_66926960 
var mydiv = getElementByID("id");
function Get_text(element) {
    var selected = element.cloneNode(true);
    var text;
    while (selected.firstChild) {
      if (selected.firstChild.nodeType == 3) text = selected.firstChild.nodeValue;
      selected.removeChild(selected.firstChild);
    }
    return text;
  }
Get_text(mydiv);
user_141912470

I know many good solutions here exist, but none of them actually achieved what I needed (get the textContent of a single node, none of its children), so sharing this for future searchers.

var html = document.getElementsByTagName("*");

for (var i = 0; i < html.length; i++) {
    var el = html[i];
    for (var j = 0; j < el.children.length; j++) {
        var child = el.children[j],
            childTextContent = child.innerHTML;
        // Remove all children tags, leaving only the actual text of the node.
        childTextContent = childTextContent.replace(/\<.*\>.*\<\/.*\>/gmi, "");
        // Also remove <img /> type tags.
        childTextContent = childTextContent.replace(/\<.*\ \/\>/gmi, "");
        console.log(childTextContent);
        // Now you can do any type of text matching (regex) on the result.
    }
});
user_12228810
Related