问题
The title is pretty clear:
Is there any major difference between innerHTML and createTextNode (used with Append) to fill a span with text?
回答1:
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.
回答2:
My understanding is that certain manipulations of innerHTML remove all bound events, so using createTextNode is preferable.
回答3:
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