SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2004
    Location
    Vancouver,BC
    Posts
    32
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Does anyone have experience to copy div content to another div?

    As far as I get for now, NS works better than IE, it is unexpected result.

    What I am trying to do is append content of one div to another one, under IE, I know there is a simple but not standard way -- innerHTML, one issue to me now is it would not run code in javascript in the content. Another way is looping through the source div and create element and attribute on the destiny div, it works unblievable great under NS, js code in the content runs very well. But it doesn't work under IE, it stops right here

    for(var i=0; i < sourcenode.attributes.length; i++){
    destnode.setAttribute(sourcenode.attributes[i].nodeName,sourcenode.attributes[i].nodeValue);
    ...}

    when it goes through attribute, id="..." and class="..." fine, and stops at style="width:300px", the error is "member not found".

    Any idea?

    Thanks

  2. #2
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This brings up a lot of issues, like the advisability of copying an id from one element to another (don't), to whether the transferred content should inherit the styles of its new container (seems reasonable), to possible scripting conflicts related to simply cloning JS haphazardly. Might depend on exactly what you wanted to use this for; anyway, here's a stab at it:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    <head>
    <title>untitled</title>
    <style type="text/css">
    
    .text {
    	font: normal 14px times;
    	text-align: justify;
    	margin: 40px auto;
    	padding: 4px 8px;
    	border: 1px black dashed;
    }
    #source {
    	width: 656px;
    	color: saddlebrown;
    }
    #dest1 {
    	width: 656px;
    	color: darkolivegreen;
    }
    #dest2 {
    	width: 656px;
    	color: purple;
    }
    
    </style>
    <script type="text/javascript">
    
    function move_subtree(source_id, dest_id)
    {
    	var sourcenode = document.getElementById(source_id);
    	var destnode = document.getElementById(dest_id);
    	var copynode = sourcenode.cloneNode(true);
    	while (copynode.hasChildNodes())
    		destnode.appendChild(copynode.removeChild(copynode.firstChild));
    }
    
    onload = function()
    {
    	setTimeout('move_subtree("source", "dest1")', 3000);
    	setTimeout('move_subtree("dest1", "dest2")', 6000);
    }
    
    </script>
    </head>
    <body>
    <div id="source" class="text"><img src="http://www.sitepoint.com/forums/images/buttons/firstnew.gif" /><br />
    "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
     aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. 
    Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."<br />
    <img src="http://www.sitepoint.com/forums/images/buttons/firstnew.gif" /></div>
    <div id="dest1" class="text">What I am trying to do is append content of one div to another one...<br /></div>
    <div id="dest2" class="text"><img src="http://www.sitepoint.com/images/sitepoint-logo.gif" />
    <img src="http://www.sitepoint.com/images/sitepoint-logo.gif" />
    <img src="http://www.sitepoint.com/images/sitepoint-logo.gif" />
    <img src="http://www.sitepoint.com/images/sitepoint-logo.gif" />
    <br /><br /></div>
    </body>
    </html>
    "it would not run code in javascript in the content" sounds like it's related to an earlier post; your problem there was unclear. The setAttribute problem is mentioned here, under "Styling the content".
    ::: certified wild guess :::

  3. #3
    SitePoint Enthusiast
    Join Date
    Sep 2004
    Location
    Vancouver,BC
    Posts
    32
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks! your reply is great.

    CloneNode doesn't work for me, I think it is because you can only clone node when the two tag created in same document. What I am trying to do is import a node by soap call, and attach it to the current document. Does it sound a bad idea? I am starting to feel this way.

  4. #4
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not very conversant with soap (although I shower regularly), but, just happened to run across this the other day. And this:

    http://javaalmanac.com/egs/org.w3c.d...eSubtree2.html

    Hard to get information on browser support, however...
    ::: certified wild guess :::


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •