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

Groups > comp.lang.javascript > #16425

Re: appendChildren versus innerhtml

Show all headers | View raw

On 5/10/2012 7:36 PM, Martin Honnen wrote:
> Andrew Poulos wrote:
>> If the server can return "arbitrary" but valid HTML such as
>>
>> "<div id='textbox01' style='position:absolute; left:36px; top:92px;
>> overflow: visible;'>" +
>> "<div style='position:absolute; left:0px; top:0px; width:496px;
>> height:488px; overflow:auto ; border-radius: 0px 0px 0px 0px'></div>" +
>> "<div style='position:absolute; left:0px; top:0px; width:496px;
>> height:488px; overflow:auto ; border-radius: 0px 0px 0px 0px'>" +
>> "<div style='; padding-left:0px; padding-right:0px; padding-top:0px;
>> padding-bottom:0px'>" +
>> "<p style='margin-top:0pt;margin-bottom:0pt;'><span
>> style='font-size:14pt;color:#000000;font-weight:bold;'><sup>The
>> Emergence</sup></span></p>" +
>> "<p style='margin-top:0pt;margin-bottom:0pt;'><span
>> style='color:#000000;'>The effect of globalisation and, more.
>> </span></p>" +
>> "<p style='margin-top:0pt;margin-bottom:0pt;'><span
>> style='color:#000000;'>&nbsp;</span></p>" +
>> "<p style='margin-top:0pt;margin-bottom:0pt;'><span
>> style='color:#000000;'>I propose to consider </span></p>" +
>> "<p style='margin-top:0pt;margin-bottom:0pt;'><span
>> style='color:#000000;'></span></p>" +
>> "</div></div></div>" +
>> "<div id='kb1' style='position:absolute; left:572px; top:208px;
>> width:400px; height:264px;'><img id='kb1img'
>> src='images/020808_1633_0030_lsls.jpg' alt='extreme' title=''
>> style='position:absolute; left:0px; top:0px; width:100%; height:100%;
>> margin:0;'></div>"
>>
>> how can you possibly parse it and use createElement/appendChild to
>> recreate the HTML. Currently I'm using innerHTML.
>
> If you have an empty element where you want to insert the HTML fragment
> then setting innerHTML of that element is the right approach. However
> these days insertAdjacentHTML
> (https://developer.mozilla.org/en-US/docs/DOM/element.insertAdjacentHTML) also
> has wide support so in case you want to insert somewhere in relation to
> already existing and populated elements that is an alternative to
> setting innerHTML and might avoid reparsing when you use
>    element.insertAdjacentHTML('beforeEnd', htmlFragment)
> instead of
>    element.innerHTML = element.innerHTML + htmlFragment

Hmm, I never knew about insertAdjacentHTML. I'll experiment with it.

> And there is
> http://domparsing.spec.whatwg.org/#dom-range-createcontextualfragment
> although IE before version 10 does not have that.

Alas I need to support back to IE 6 but its something I'll investigate..

One odd thing I've discovered is that if there's  say an OBJECT playing 
an MP3 and I set the innerHTML to "" the MP3 sometimes keeps playing. 
I've had to search for MP3 and explicitly stop them before I set the 
innerHTML to "". Is that typical?

Andrew Poulos

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

Thread

appendChildren versus innerhtml Andrew Poulos <ap_prog@hotmail.com> - 2012-10-05 08:08 +1000
  Re: appendChildren versus innerhtml Danny <dann90038@gmail.com> - 2012-10-04 15:41 -0700
  Re: appendChildren versus innerhtml Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-10-05 01:02 +0200
    Re: appendChildren versus innerhtml Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-10-05 01:25 +0200
    Re: appendChildren versus innerhtml Andrew Poulos <ap_prog@hotmail.com> - 2012-10-05 09:58 +1000
  Re: appendChildren versus innerhtml Martin Honnen <mahotrash@yahoo.de> - 2012-10-05 11:36 +0200
    Re: appendChildren versus innerhtml Andrew Poulos <ap_prog@hotmail.com> - 2012-10-06 18:31 +1000
  Re: appendChildren versus innerhtml Matt McDonald <matt@fortybelow.ca> - 2012-10-05 15:46 -0400

csiph-web