Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Jul 2002
    Location
    Iran
    Posts
    695
    Thanks
    0
    Thanked 0 Times in 0 Posts

    "createElement" problem

    I saw a code that the scripter used v=createElement("div") for making a div in his document. Then he used

    v.setAttribute("id","ourDiv")

    for giving that an ID and then he used several commands, like v.style.backgroundcolor = "red" to change the div's style. I saw that code in a kind of big program, and when I tried to split that into seperate parts, I came up with the results that I think are reasonable, but the problem is that my program doesn't work! and his works! since I didn't know anything about this document.createElement("div"), did I have any mistake in writing the proper code or what? I write my complete code below that you see, but I actually said the whole thing above.


    //---------------------------------------------------------------------------

    <html>
    <head>
    <title>Untitled</title>
    <script>
    function makeDiv()
    {
    var v=document.createElement("div");
    v.setAttribute("id","ourDiv");

    v.style.position='relative';
    v.style.left=100+'px';
    v.style.top=100+'px';
    v.style.width=200+'px';
    v.style.height=200+'px';
    v.style.backgroundColor="blue";
    v.style.visibility='visible';
    v.style.padding='0px 0px 0px 0px';

    return v;
    }
    </script>
    </head>

    <body>
    <script>
    tt = new makeDiv();
    tt.innerHTML = "salam";
    </script>

    </body>
    </html>

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Nashua, NH
    Posts
    1,724
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You need to append an element, created by document.createElement() to your document tree. Only then it becomes part of your document and is rendered (styles permitting).

    For example if you want to append that div to the body of your document you need to do this:
    document.body.appendChild(tt);

    Also if you need to set more than one style attribute, define a style class
    ttstyles
    {
    ......
    .......
    }

    and use the following command:

    tt.className='ttstyles'

    ..or at least use the "with" statement:
    with (v.style)
    { left='100px';
    right='100px';
    //and so on.....
    }
    - saves you some typing......
    Last edited by Vladdy; 08-26-2002 at 10:31 PM.
    Vladdy | KL
    "Working web site is not the one that looks the same on common graphical browsers running on desktop computers, but the one that adequately delivers information regardless of device accessing it"

  • #3
    Regular Coder
    Join Date
    Jul 2002
    Location
    Iran
    Posts
    695
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you vladdy, now it's working!


  •  

    Posting Permissions

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