Posted 8/13/2019
There are some
interesting differences
between the two contestants.
Most noticeable IMO that innerText triggers a re-flow, thus, whenever possible use textContent.
And I found a surprising one on top:
someNode.innerText =
`some multi
line text
!`;
I would expect the nodeValue of someNode to have three lines, with line breaks and to be rendered as simple text in one line - ignoring line breaks as usual.
Turns out, line breaks get converted into <br> tags!
Pretty weird and unexpected. The naming innerText is certainly misleading as it creates DOM elements.
But textContent to the rescue!
It behaves as expected: Line breaks? Yes. <br> tags? No!
Another reason for textContent.
The final results for innerText vs textContent is 0:2 - textContent is the clear winner of this match.