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

Groups > comp.lang.javascript > #33817

Re: Inserting stuff received with AJAX into the DOM

Show all headers | View raw

Stefan Ram wrote:

> bit-naughty@hotmail.com writes:
>>Just to add - I would like to add "rt" into the DOM tree as a
>><DIV> *with a particular id* - how do I do that??
> 
>   I'm not an expert in DOM scripting, here is an untested attempt:

s/DOM//
 
> { const text = document.createTextNode( rt );
>   const par = document.createElement( 'p' ); par.appendChild( text );
>   const div = document.createElement( 'div' ); div.appendChild( par );
>   div.setAttribute( 'id', 'particularid' );
>   whereyouwanttoappendit.appendChild( div ); }

Using the “const” keyword makes this code unnecessily incompatible.  It is 
also questionable whether “const” satisfies the semantics of the code as the 
referred values are highly mutable.

The first thing that one wants to do is to test each return values before 
one uses it:

  if (par && text) par.appendChild(text);

Even better, in a function is the “gauntlet” or “early return” approach:

  if (!(par && text)) return …;

Note that unfortunately not all DOM implementations have returned a 
reference to the appended node from .appendChild() in the past, so while 
method chaining may be appealing, it is not wise.

Then

  div.setAttribute( 'id', 'particularid' );

can and should be

  div.id = "particularid";

as it avoids one less backwards-compatible method call.

Other than that, the approach is sound: It is more efficient to construct a 
subtree in memory and append it, than to append the separate nodes to the 
document directly.  The goal here is to minimize the number of reflows.

-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

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

Thread

Inserting stuff received with AJAX into the DOM bit-naughty@hotmail.com - 2017-08-19 12:35 -0700
  Re: Inserting stuff received with AJAX into the DOM bit-naughty@hotmail.com - 2017-08-19 12:55 -0700
    Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-20 12:16 +0200
      Re: Inserting stuff received with AJAX into the DOM Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2017-08-20 15:55 +0200
        Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-20 19:18 +0200
          Re: Inserting stuff received with AJAX into the DOM Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2017-08-20 21:50 +0200
            Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-20 22:39 +0200
              Re: Inserting stuff received with AJAX into the DOM Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2017-08-21 08:29 +0200
                Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-21 16:44 +0200
                Re: Inserting stuff received with AJAX into the DOM Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2017-08-21 17:24 +0200
                Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-21 17:47 +0200
                Re: Inserting stuff received with AJAX into the DOM Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2017-08-21 19:50 +0200
                Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-21 22:16 +0200
                Re: Inserting stuff received with AJAX into the DOM Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2017-08-26 09:25 +0200
                Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-27 03:02 +0200
  Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-20 12:30 +0200
  Re: Inserting stuff received with AJAX into the DOM bit-naughty@hotmail.com - 2017-08-20 07:37 -0700
    Re: Inserting stuff received with AJAX into the DOM "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2017-08-20 17:17 +0200
    Re: Inserting stuff received with AJAX into the DOM Tim Streater <timstreater@greenbee.net> - 2017-08-20 17:48 +0100
  Re: Inserting stuff received with AJAX into the DOM bit-naughty@hotmail.com - 2017-08-20 11:21 -0700
    Re: Inserting stuff received with AJAX into the DOM Tim Streater <timstreater@greenbee.net> - 2017-08-20 19:29 +0100
    Re: Inserting stuff received with AJAX into the DOM "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2017-08-21 01:29 +0200
      Re: Inserting stuff received with AJAX into the DOM Andrew Poulos <ap_prog@hotmail.com> - 2017-08-21 16:29 +1000
        Re: Inserting stuff received with AJAX into the DOM "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2017-08-21 12:25 +0200
        Re: Inserting stuff received with AJAX into the DOM Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-08-21 16:47 +0200

csiph-web