title: Javascript Maintain Scroll Position
body: <p>I'm trying to make my webpage refresh and maintain it's scroll position with this code:</p>
  
  <pre><code>function refreshPage() {
                  var page_y = document.getElementsByTagName("body")[0].scrollTop;
                  window.location.href = window.location.href.split('?')[0] + '?page_y=' + page_y;
              }
              window.onload = function() {
                  setTimeout(refreshPage, 35000);
                  if ( window.location.href.indexOf('page_y') != -1 ) {
                      var match = window.location.href.split('?')[1].split("&amp;")[0].split("=");
                      document.getElementsByTagName("body")[0].scrollTop = match[1];
                  }
              }
  </code></pre>
  
  <p>While this successfully adds the ?page_y=scrollposition and the scroll position is accurate, and I can print match and match[1] to the console successfully, the only problem is it does not scroll the page.</p>
  
  <p><strong>EDIT:</strong></p>
  
  <p>Apparently, the script is loading before my script to generate the content of the web page and I'm not quite sure why. Posting entire code below:</p>
  
  <pre><code>    &lt;script&gt;
          $(window).load(function(){ 
              $.getJSON("sun.json", function(json1) {
                  $.each(json1, function(key, data) {
                      document.body.innerHTML += 
                                                                      "&lt;div id='" + data.video + "' class='caption' data-source='" + data.video + "' data-title='" + data.title + "' data-desc='" + data.description + "' onclick='parent.changeVideo(dataset.source, dataset.title, dataset.desc); reloadImg()'&gt;" +
                                                                          "&lt;img class='thumbnail' src='" + data.thumb + "' alt='" + data.title + "'&gt;" +
                                                                          "&lt;div class='caption-text'&gt;" +
                                                                              "&lt;b class='caption-title'&gt;" + data.title + "&lt;/b&gt;" +
                                                                              data.description +
                                                                          "&lt;/div&gt;" +
                                                                      "&lt;/div&gt;" +
                                                                      "&lt;hr&gt;"
                      console.log("This should be first");
                      $(".caption").hover(function(){
                          $(this).find(".caption-text").fadeIn(400);
                      }, 
                      function(){
                          $(this).find(".caption-text").fadeOut(400);
                      });
                  });
              });
          });
  
          var scroll = $(window).scrollTop();
          // yada
          $("html").scrollTop(scroll);
  
          function changeVid() {
              document.querySelector("#current-video_html5_api").src = data.video
              console.log(data.video);
          }
      &lt;/script&gt;
  
      &lt;script&gt;
          function refreshPage() {
              var page_y = document.getElementsByTagName("body")[0].scrollTop;
              window.location.href = window.location.href.split('?')[0] + '?page_y=' + page_y;
          }
          var match = window.location.href.split('?')[1].split("&amp;")[0].split("=");
  
         window.onload = function() {
              setTimeout(refreshPage, 35000);
              if ( window.location.href.indexOf('page_y') != -1 ) {
  
                  //document.getElementsByTagName("body")[0].scrollTop = match[1];
                  window.scrollTo(0, match[1]);
                  console.log(match[1]);
                  console.log("This should come second");
              }
          }
      &lt;/script&gt;
  </code></pre>