0
<h1>Product<span>4.0%</span></h1>

In the above HTML block, I would like to query and fetch the innerText of only the <h1> element, excluding the span element.

However

document.querySelector('h1:not(span)').innerText

outputs: 'Product4.0%'

I would like the output to be: Product

j08691
  • 204,283
  • 31
  • 260
  • 272
Mathias Fossum
  • 1
  • 1
  • 1
    `document.querySelector('h1').childNodes[0].textContent` – mplungjan Dec 13 '21 at 15:30
  • 1
    `h1:not(span)` searches for all `h1` elements that aren't, themselves, `span` elements (and thus makes no sense). It doesn't leave out the `span` in what it returns (which is good, what it returns is a direct link to the element in the DOM, and you wouldn't want a function called "query" to *remove* something from the page). If you want the text without the text of the span, you have to loop through the children of the `h1` and build up their text content, omitting the `span`. – T.J. Crowder Dec 13 '21 at 15:31
  • If there is whitespace, filter the childNodes – mplungjan Dec 13 '21 at 15:31
  • @MathiasFossum - ***Wow***, how did I miss that [`textContent`](https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent) is on Node, not Element?! Excellent! – T.J. Crowder Dec 13 '21 at 15:35

0 Answers0