The title is pretty clear:
Is there any major difference between innerHTML and createTextNode (used with Append) to fill a span with text?
Of course. createTextNode will escape any strings and show them as they are, while innerHTML could render html-like strings into a DOM. If you don't want that (unless you are sure the text contains no unescaped tags, e.g. when assigning a literal directly), you can use textContent (or innerText for IE).
Yet I'd recommend createTextNode, because all browsers support it equally without any quirks.
My understanding is that certain manipulations of innerHTML remove all bound events, so using createTextNode is preferable.
Doing some research online, here's what I've found. This should cover it at a high level:
elem.createTextNode(text) and elem.textContent = text do the exact same thing (src: https://javascript.info/task/createtextnode-vs-innerhtml)
While textContent returns the full text contained in a node, innerText returns only the visible text contained in the node. (src: Difference between textContent vs innerText)
来源：https://stackoverflow.com/questions/13122760/is-there-any-major-difference-between-innerhtml-and-using-createtextnode-to-fill