// textContent gets the content of all elements, including <script> and <style> elements.
// textContent returns every element in the node.
// innerText only shows “human-readable” elements.
// innerText looks at styling and won't return the text of “hidden” elements.
<style>
.special { display: none; }
</style>
<h1>Heading <span class="special">Special</span> </h1>
const h1 = document.querySelector('h1');
console.debug(h1.textContent); // " Heading Special "
console.debug(h1.innerText); // "Heading"