Create new DOM objects?

Discussion in 'JavaScript' started by TriKri, Jul 11, 2007.

  1. #1
    Hello! I have written this test code:

    <html>
      <head>
        
    <script type="text/javascript">
    function load()
    {
      document.body.innerHTML += "Hello, page is loaded!";
      document.body.innerHTML += "<br /><div id='my_div'>Hi!</div>";
      document.getElelementsById("my_div").innerHTML += "<br />My humps";
    }
    </script>
    
      </head>
      <body onload="load()">
        
      </body>
    </html>
    Code (markup):
    As you may se I would like to first create a div inside of the body with the id "my_div" and the content "Hi!", then I would like to reach the div through the DOM and add the text "My humps" to the content. But when the page is loaded it only displays "Hi!". Why? Couldn't the div be reached through the DOM?
     
    TriKri, Jul 11, 2007 IP
  2. it career

    it career Notable Member

    Messages:
    3,562
    Likes Received:
    155
    Best Answers:
    0
    Trophy Points:
    270
    #2
    my_div has to be present statically in your page.
     
    it career, Jul 11, 2007 IP
  3. TriKri

    TriKri Peon

    Messages:
    19
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thanks for your reply!

    So if I have got this right there is no other way than making an own function that tracks down the id "my_div" in document.body.innerHTML and then inserts "<br />My humps" before the div's closing tag? There is nothing like CreateObject() or something?
     
    TriKri, Jul 11, 2007 IP
  4. ansi

    ansi Well-Known Member

    Messages:
    1,483
    Likes Received:
    65
    Best Answers:
    0
    Trophy Points:
    100
    #4
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
      <title> new document </title>
      <script type="text/javascript">
    	function init()
    	{
    		var my_div, br, parent = document.getElementById("container");
    		my_div = document.createElement("div");
    		br = document.createElement("br");
    		my_div.setAttribute("id","my_div");
    		my_div.appendChild( document.createTextNode("Hi!") );
    		parent.appendChild(my_div);
    		parent.appendChild(br);
    	}
    	window.onload = init;
      </script>
     </head>
     <body>
      <div id="container">
      </div>
     </body>
    </html>
    
    
    HTML:
     
    ansi, Jul 11, 2007 IP
  5. TriKri

    TriKri Peon

    Messages:
    19
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Thanks a lot ansi! That really worked! Isn't JavaScript awsome? :D I like it big time...
     
    TriKri, Jul 11, 2007 IP
  6. chriswick

    chriswick Peon

    Messages:
    907
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Just another programming language to me lol but if you really like it them why not.
     
    chriswick, Jul 17, 2007 IP