Difference between innerText, innerHTML, and childNodes[].value?

Question

What is the difference between innerHTML, innerText and childNodes[].value in JavaScript?

Answer 1

In terms of MutationObservers, setting innerHTML generates a childList mutation due to the browsers removing the node and then adding a new node with the value of innerHTML.

If you set innerText, a characterData mutation is generated.