Is there any major difference between innerHTML and using createTextNode to fill a span?

javascript innerhtml createtextnode
Jeff Noel picture Jeff Noel · Oct 29, 2012 · Viewed 12.9k times · Source

The title is pretty clear: Is there any major difference between innerHTML and createTextNode (used with Append) to fill a span with text?

Answer

Bergi picture Bergi · Oct 29, 2012

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.

Related questions

How do I add a non-breaking whitespace in JavaScript without using innerHTML?

I'm generating content dynamically and in some instances, I need to set a &nbsp; as the only content of a <span> element. However, the following adds &nbsp; as text vs adding a empty space: var foo = …

Read More
JavaScript TextNode update

If I have a var t = document.createTextNode(text) parent.appendChild(t); Is it possible to simply update the contents of t? I would like to change the text inside the parent without using removeChild, createTextNode and appendChild. Why would …

Read More
How to replace innerHTML of a div using jQuery?

How could I achieve the following: document.all.regTitle.innerHTML = 'Hello World'; Using jQuery where regTitle is my div id?

Read More