Изменить положение DIV после обновления страницы

Question

У меня есть 3 DIV, как этот код: -

<div class="row" id="wrapper"> 
<div id="div1"></div> 
<div id="div2"></div> 
<div id="div3"></div> 
</div> 

и когда нажмите кнопку обновления

<button id="refresh">Refresh</button> 

Меняем мой DIV, но мне нужно, когда обновить мою страницу, Измените мой div.

Таким образом, мне не нужно нажимать на обновления, мне нужно при открытии страницы изменить положение DIV каждый раз

код

My Javascript является: -

 var chain = [ 
      document.getElementById("div1"), 
      document.getElementById("div2"), 
      document.getElementById("div3") 
     ], 
     wrapper = document.getElementById("wrapper"), 
     refresh = document.getElementById("refresh"); 

     refresh.onclick = function() { 
      chain.push(chain.shift()); 
      for (var i=0, len = chain.length; i < len; i++) { 
       var el = chain[i]; 
       wrapper.removeChild(el); 
       wrapper.appendChild(el); 
      }; 
      console.log(chain); 
     }; 

Answer 1

Если вы хотите, чтобы вас придется использовать куки! ммм ... все равно о печенье: http://www.w3schools.com/js/js_cookies.asp

Код:

document.cookie="height: 99px"; 

Теперь вы можете

document.getElementById("div1").height(document.cookie); 

Answer 2

Как я заметил, вы можете использовать куки для контроля, если страница была обновлена. Вы можете контролировать, когда пользователь выгрузить страницу, так, что это будет что-то вроде:

var chain = [ 
    document.getElementById("div1"), 
    document.getElementById("div2"), 
    document.getElementById("div3") 
], 
    wrapper = document.getElementById("wrapper"), 
    refresh = document.getElementById("refresh"); 

refresh.onclick = function() { 
    chain.push(chain.shift()); 
    for (var i=0, len = chain.length; i < len; i++) { 
     var el = chain[i]; 
     wrapper.removeChild(el); 
     wrapper.appendChild(el); 
    }; 
    console.log(chain); 
}; 

///////////////////// 

if(!!getCookie('refresh') == location.pathname){ 
    setCookie('refresh', '', -1); 
    refresh.click(); 
} 

window.onbeforeunload = function(){ 
    setCookie('refresh', location.pathname, 1); 
}; 

///////////////////// 

function setCookie(cname, cvalue, exdays) { 
    var d = new Date(); 
    d.setTime(d.getTime() + (exdays*24*60*60*1000)); 
    var expires = "expires="+d.toUTCString(); 
    document.cookie = cname + "=" + cvalue + "; " + expires; 
} 
function getCookie(cname) { 
    var name = cname + "="; 
    var ca = document.cookie.split(';'); 
    for(var i=0; i<ca.length; i++) { 
     var c = ca[i]; 
     while (c.charAt(0)==' ') c = c.substring(1); 
     if (c.indexOf(name) == 0) return c.substring(name.length,c.length); 
    } 
    return ""; 
} 

Вы можете check the jsFiddle. Помните, что jsFiddle меняет путь (он добавляет «/ show /»), поэтому вам нужно попробовать его в своей среде, jsfiddle действителен, чтобы посмотреть, как хранится файл cookie и работает код.

редактировать: Чтобы попробовать в скрипку, измените значение куки для некоторой строки (замените location.pathname на "yes"), поэтому он должен работать, как ожидалось.