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 4 of 4
  1. #1
    New Coder
    Join Date
    Sep 2012
    Location
    Houston, TX
    Posts
    22
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Appending Element with getElementById

    Would this be the correct way to utilize innerHTML to append rather then replace

    document.getElementById("topstreams").innerHTML +=

    i looked it up and it gave this example.. however i cant seem to get it to function... my code for reference

    Code:
    <script>
    function viewallstreams(o)
    {
       var base = o.streams;
       if (base.lenght <= 25)
         {
         var streams = base.lenght
         }
       else
         {
         var streams = 25
         }
    
       for (var i = 0; i < streams; i ++ )
       {
          var status = base[i].channel.status
          if (status.length > 76)
          {
          var status = status.substr(0,76)
          }
    
          document.getElementById("topstreams").innerHTML += '<div class="image"> <a href="tream.php?stream='+ base[i].channel.name 
    
    +'"><img src="' + base[i].channel.logo + '" alt="" /></a> </div><center><h4><a href="tream.php?stream='+ base[i].channel.name +'">' + 
    
    base[i].channel.name + '</a></h4></center>
    <center>' + status +'</center></div>'
       }
    }
    </script>
    The callback if your curios

    Code:
    <script 
        type="text/javascript" 
        src="https://api.twitch.tv/kraken/streams?game=DayZ&callback=viewallstreams">
    </script>
    and an example of what the actual HTML that i'm trying to append into the field looks like.. it needs to loop and continue to append to generate a list that is being formatted via CSS

    Code:
                <div class="article" id="topstreams">
    
                  <div class="image"> <a href="http://linkurl.com/"><img src="css/images/imgurl.jpg" alt="" /></a> </div>
                  <center><h4><a href="http://linkurl.com/">Featured 1</a></h4></center>
    	      <center>LLorem ipsum dolor sit amet, consectetur adipisicing elit, sed... </center>
    
                </div>

  • #2
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Quote Originally Posted by erebus View Post
    Would this be the correct way to utilize innerHTML to append rather then replace

    document.getElementById("topstreams").innerHTML +=

    i looked it up and it gave this example.. however i cant seem to get it to function...
    Instead of asking others to do the job of the error console, try using the error console.

  • #3
    New Coder
    Join Date
    Sep 2012
    Location
    Houston, TX
    Posts
    22
    Thanks
    2
    Thanked 0 Times in 0 Posts
    resolved... When i copied it from my editor to the open copy of the atchual page it somehow added a line break in the middle of the code being inserted... it did not care for this

  • #4
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Quote Originally Posted by erebus View Post
    resolved... When i copied it from my editor to the open copy of the atchual page it somehow added a line break in the middle of the code being inserted... it did not care for this
    So no trouble with the misspelling of 'length'?


  •  

    Posting Permissions

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