Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #8361

Re: David Mark's Javascript Daily - Volume #3 - Tip #6 - How to Get and Set HTML

Show all headers | View raw

On 15/11/2011 19:26, Andreas Bergmaier wrote:
> David Mark schrieb:
>> Despite there being no standard behind the innerHTML property and the
>> somewhat awkward feel of dealing with serialized DOM structures, I
>> virtually always choose the string over the (XML) document object.
>> It's much simpler, faster, requires less code, less function calls
>> and, having debuted in IE 4, has enough successful history behind it
>> to be trusted.
>
> Why is that faster? Only because the native html parser is faster than
> the javascript interpreter?
> I could understand the use of innerHTML when it's for large static
> elements delivered as plain text per ajax - where the server can
> serialize the structure into HTML. But when it comes to elements with
> event listeners, I absolutely prefer DOM building methods.
> Using a "library" function that takes the element name, attributes,
> child nodes and event listeners as attributes, I can build dom
> structures much easier than (hand)writing serialized html strings.
> Also I can't believe that it would be faster to serialize the structure
> to a string, process this with the innerHTML parser, and then dig in the
> dom tree again to set the listeners (Thats what I really hate jQuery for).
> Using plain dom methods (document.createElement,
> document.createTextNode, el.appendChild, el.addEventListener) I've never
> experienced problems with tables or select elements, and I'm not limited
> to divs.
> Or does that only work in recent browsers?

Searching the Internet, we can find some performance tests proving that 
innerHTML really seems to be faster than the W3C DOM methods. Of course 
results may differ significantly from browser to browser and from 
version to version. E.g. <http://www.quirksmode.org/dom/innerhtml.html>

However, take a look at this article from Mozilla: 
<https://developer.mozilla.org/En/DOM/Element.innerHTML>

Also: innerHTML in HTML 5 
<http://www.w3.org/TR/2008/WD-html5-20080610/dom.html#innerhtml0>

-- 
Joao Rodrigues (J.R.)

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

David Mark's Javascript Daily - Volume #3 - Tip #6 - How to Get and Set HTML David Mark <dmark.cinsoft@gmail.com> - 2011-11-15 11:47 -0800
  Re: David Mark's Javascript Daily - Volume #3 - Tip #6 - How to Get and Set HTML Andreas Bergmaier <andber93@web.de> - 2011-11-15 22:26 +0100
    Re: David Mark's Javascript Daily - Volume #3 - Tip #6 - How to Get and Set HTML Gregor Kofler <usenet@gregorkofler.com> - 2011-11-15 22:57 +0100
    Re: David Mark's Javascript Daily - Volume #3 - Tip #6 - How to Get and Set HTML "J.R." <groups_jr-1@yahoo.com.br> - 2011-11-15 21:16 -0200
    Re: David Mark's Javascript Daily - Volume #3 - Tip #6 - How to Get and Set HTML Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2011-11-16 01:11 +0100
      Re: David Mark's Javascript Daily - Volume #3 - Tip #6 - How to Get and Set HTML Andreas Bergmaier <andber93@web.de> - 2011-11-16 02:29 +0100
  Re: David Mark's Javascript Daily - Volume #3 - Tip #6 - How to Get and Set HTML Dr J R Stockton <reply1146@merlyn.demon.co.uk> - 2011-11-16 18:51 +0000

csiph-web