Path: csiph.com!usenet.pasdenom.info!gegeweb.42!gegeweb.eu!nntpfeed.proxad.net!proxad.net!feeder2-2.proxad.net!newsfeed.arcor.de!newsspool3.arcor-online.net!news.arcor.de.POSTED!not-for-mail
Content-Type: text/plain; charset="UTF-8"
Message-ID: <1696311.PW8hBe8qbu@PointedEars.de>
From: Thomas 'PointedEars' Lahn <PointedEars@web.de>
Reply-To: Thomas 'PointedEars' Lahn <cljs@PointedEars.de>
Organization: PointedEars Software (PES)
Date: Mon, 07 May 2012 21:57:47 +0200
User-Agent: KNode/4.4.11
Content-Transfer-Encoding: 8Bit
X-Face: %i>XG-yXR'\"2P/C_aO%~;2o~?g0pPKmbOw^=NT`tprDEf++D.m7"}HW6.#=U:?2GGctkL,f89@H46O$ASoW&?s}.k+&.<b';Md8`dH6iqhT)6C^.Px|[=M@7=Ik[_w<%n1Up"LPQNu2m8|L!/3iby{-]A+#YE}Kl{Cw$\U!kD%K}\2jz"QQP6Uqr],./"?;=4v
Face: iVBORw0KGgoAAAANSUhEUgAAADAAAAAwBAMAAAClLOS0AAAAGFBMVEXTxa4RFk5dUWANED8PFEfy7+MGBiW+n3ZNF/QuAAACaElEQVQ4jVXUwVOcMBQG8Dc7Rc4PUntdWV2uxjDpGaGeozOp1woar4jd5t/v9wLstMwsA/ntlxdCAgUc1hjTc9/JCZfGoo3wG3HdmdAWrIJRHe7GM/TmpY5VFefuVcAkkPbLIaN8rmPmjloyZxgyR3GuJ4K0AGtJ2htz8o7yqikm759fldQXaMpbDzjKAG+8v+AugVTOPO5DOjLvGtUYQwh0CPjnVMyGd+8/GfUB5nLKJDD2aLDh5HYyMDJGDwQIo2ZmZcKbowNmAdB/AzyFhrmF2MHRb0QJJfaAnwGB6orZhoykLzJtGwF/xpYxI1dswomiUj3gTuAIqCn/4C7cULwGNBtwMTk3Y4LfKB5YUaOKBKYtpplm7u0vip8tU1NWWyI/7XdcSuIDoMt6rVHMWT0DbjHPGqDqZVSa6zleLcUTcIKLoMv3ueJluALtAo9B302zPPlrtiVScRdCjXvVh3e3JpYa/jjkuC9N+LrBMlz/eAN4eQijX2EdLo6c5tGGHwLyHFtXk89dDGHwCVhG9T0S/j55AhRZgkMCmUQXJ49TnS1wnQDvw0eAh9ICeMmEFbCnPMFzjAvsWoEWEFdYEx+S0MoUZ1gT1wId8+AF3Bl2OoEu906AUHx5VLw/gXYg/x84loOah/2UYNrgiwSwGO7RfUzVBbx/kgpckumGOi6QirtD6gkLTitbnxNol47S2jVc2vsN5kPqaAHT8uUdAJM4v/DanjYOwmUjWznGfwB7sGtAtor5BgofDuzaRj4kSQAqDakTsKORa3Q3xKi3gE1fhl71KRMqrdZ2AWNNg/YOhQyrVBnb+i+nEg4bsDA+egAAAABJRU5ErkJggg==
Subject: Re: Appending a TABLE to a DIV
Newsgroups: comp.lang.javascript
References: <jo5kjb$mf8$1@speranza.aioe.org> <18-dnehfiNOGUTvSnZ2dnUVZ8oqdnZ2d@giganews.com>
Followup-To: comp.lang.javascript
MIME-Version: 1.0
Lines: 75
NNTP-Posting-Date: 07 May 2012 21:57:47 CEST
NNTP-Posting-Host: 70c8b70c.newsspool1.arcor-online.net
X-Trace: DXC=9]c92YJPBDaeoCI^f\Y]Eaic==]BZ:afn4Fo<]lROoRankgeX?EC@@`PmZQ?n;CHJeDZm8W4\YJNlJ`:FmdeL>K`U@3`]Ai;BfbARU]gVD95Jm
X-Complaints-To: usenet-abuse@arcor.de
Xref: csiph.com comp.lang.javascript:13852

Richard Cornford wrote:

> Richard Maher wrote:
>> Can someone please tell me why, in the code below, can I see the
>> table when I append it to the document.body but not the DIV(wire)?
>>
>> That is: -
>>      wire.appendChild(decal);       // shows a ghost of the table
>>      document.body.appendChild(decal);  // shows the whole table
>>
>> Cheers Richard Maher
>>
>> <html>

The required `DOCTYPE' declaration (HTML 4.01, XHTML) or HTML5 doctype is 
missing.

>> <head>
>>    <script language="javascript">

The `type' attribute, which is required in HTML 4.01, XHTML 1.0 Strict and 
XHTML 1.1, is missing.  The `language' attribute ranges from being 
deprecated (HTML 4.01 Transitional, XHTML 1.0 Transitional) to invalid
(HTML 4.01 Strict, XHTML 1.0 Strict, XHTML 1.1, HTML5 WD).

Documents that are likely to be downloaded as a file should also include a 
declaration of the character encoding used in the document, as not all 
applications can automatically add that declaration.

<http://validator.w3.org/>

>> function load(){

It is probably a good idea to avoid function names that are identical with 
DOM event types, such as `load'.

>>     var flyScreen = function() {
>>         var OPACITY = 25;
>               ^^^^^^^   ^^
>>         var wire = document.createElement('div');
> <snip>
>>         wire.style.opacity=(OPACITY / 100);
>                      ^^^^^^^
>>         wire.style.MozOpacity=(OPACITY / 100);
>                         ^^^^^^^
>>         wire.style.filter='alpha(opacity='+OPACITY+')';
>                                    ^^^^^^^
> <snip>
> 
> If you set the opacity of the DIV to 25% of opaque then it, and all of
> the elements it contains (are appended to it, or its decedents) will be
> 75% transparent. That seems sufficient to explain the most literal
> interpretation of "ghost of the table".

ISTM that the main issue here is that the OP is not aware that the same  
node cannot be appended as the child node of two different parent nodes.  

Subsequent calls of appendChild() with the same argument value will – 
effectively – move the node referred by the argument from the previous 
parent node to the target node (which is can be made part of an efficient 
approach to sort a table).

The best solution for this problem is to create a new node object using the 
cloneNode() method as provided by the Node interface, and append that new 
node to the other parent node instead:

  wire.appendChild(decal);
  document.body.appendChild(decal.cloneNode(true));

See also: <http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-184E7107>


PointedEars
-- 
When all you know is jQuery, every problem looks $(olvable).