3 ms·
I'm confused by this comment. I don't think you can shove arbitrary html into a nodeValue, although you can do it with innerHTML. Using your example, this wor
by willwagner 17y ago
I'm confused by this comment. I don't think you can shove arbitrary html into a nodeValue, although you can do it with innerHTML. Using your example, this works fine:
e.innerHTML = "Hello & world, here's some HTML <span>Some html</span>";
I believe the intent of the original author was to point out that basic DOM manipulation methods like appendChild, removeChild, etc are slower than innerHTML, which in almost all cases, is true. Whether it's worth doing so is another matter.
If you have a fairly complex document, inserting multiple children can slow things down quite a bit as the browser has to reflow the document between each insert/append. Bulking them up in an array of strings, joining them, and inserting them into an innerHTML makes the reflow happen only once. The document fragment approach can help a lot over multiple appends/inserts, but it has some tradeoffs too as far as performance.
Duly noted about user provided data though being a security risk.
- axod 17y agoMy point was that having to escape things like open close tags, ampersands etc looks horrible and ugly. HTML entities inside HTML code inside strings isn't something I enjoy looking at. (My example code shows some HTML code as plain text, which needs htmlEntities when using innerHTML). You can't put anything in nodeValue apart from a string value. But the good thing is, it's just a string. No security issues, no entity encoding, no html tag issues.
- willwagner 17y agoI see your point; I misread it first time around. From a security point of view for user content, nodeValue is a much better approach.