www.webdeveloper.com
Results 1 to 6 of 6

Thread: innerHTML and for loop

  1. #1
    Join Date
    Jan 2010
    Posts
    127

    innerHTML and for loop

    Is it possible to populate a div's innerHTML with a for loop?

    I'm trying to display the number of days per month depending on the month.

    Code:
    for (var i = 1; i < fulldays + 1; i++){
    	document.write(i);
    }
    This writes 1-31 on my page fine, but if I attempt to use some of my buttons it then messes up the page.

    Code:
    for (var i = 1; i < fulldays + 1; i++){
    	document.getElementById('days').innerHTML = i;
    }
    This simply writes 31 to my div, is it possible to get this to display 1-31 instead?

    Cheers,

    Aravona
    L.U.N.E for anyone and everyone who has an interest in literature

  2. #2
    Join Date
    Mar 2012
    Location
    France
    Posts
    23
    for (var i = 1; i < fulldays + 1; i++){
    if (i==1) {var a = "";} else {var a = "-";}
    var newtext = document.createTextNode(a+i);
    document.getElementById("ID_of_your_element").appendChild(newtext);
    }

    I'm totally in it at this moment :-)
    Last edited by Ddurand; 04-10-2012 at 04:19 AM. Reason: Spelling -- even better

  3. #3
    Join Date
    Jan 2010
    Posts
    127
    Thanks for that its done mostly what I want now to tweak it.
    L.U.N.E for anyone and everyone who has an interest in literature

  4. #4
    Join Date
    Apr 2010
    Location
    Oslo, Norway
    Posts
    89
    And please do not use document.write ever again, unless in extremely rare cases
    - Spinner
    Producer, Developer, Gamer, Father and Husband.

    Spinners Web-development blog

  5. #5
    Join Date
    Jan 2007
    Location
    Wisconsin
    Posts
    2,120
    More efficient method ...

    PHP Code:
    var days '';
    for (var 
    1fulldays 1i++){
        
    days += String(i);
    }
    document.getElementById('days').innerHTML days
    Calculate your innerHTML in a normal variable first. Updating it in a loop will cause performance problems if your application grows in complexity. Probably not an issue for what you're doing, but a good habit to get into.

    Also, note that setting innerHTML is generally faster than creating and appending nodes.
    Jon Wire

    thepointless.com | rounded corner generator

    I agree with Apple. Flash is just terrible.

    Use CODE tags!

  6. #6
    Join Date
    Aug 2007
    Posts
    3,767
    Quote Originally Posted by Aravona View Post
    This simply writes 31 to my div, is it possible to get this to display 1-31 instead?
    Well, technically it wrote one, then two, then three, ..., to the div, so fast you only saw the result of the final one, 31.
    Great wit and madness are near allied, and fine a line their bounds divide.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles