Html js div gizle göster

<button onclick="gizleGoster('div1');">tıkla </button>
<button onclick="gizleGoster('div2');">tıkla </button>
<button onclick="gizleGoster('div3');">tıkla </button>
<button onclick="gizleGoster('div4');">tıkla </button>
<button onclick="gizleGoster('div5');">tıkla </button>

<div id="div1" style="display:none">Gizlenip gösterilen nesne1</div>
<div id="div2" style="display:none">Gizlenip gösterilen nesne2</div>
<div id="div3" style="display:none">Gizlenip gösterilen nesne3</div>
<div id="div4" style="display:none">Gizlenip gösterilen nesne4</div>
<div id="div5" style="display:none">Gizlenip gösterilen nesne5</div>



hangi buttona tıkllanırsa sadece onun divi tek açılsın ve sayfayı yenilediğimde en son gitiğim div tek gözüksün js nasıl yapabilirim

HTML Örnek

<button onclick="hide('1');">tıkla </button>

Butonlara sadece numaralandırarak fonksiyona gönderelim.

      function hide(div){

        if(document.getElementById("div"+div).style.display == "none"){
          document.getElementById("div"+div).style.display = "block";
        }else{
          document.getElementById("div"+div).style.display = "none";
        }


      }

Her tıklandığında eğer gizliyse aktif olur, aktifse gizli olur. Bu şekilde bir deneyin çalışıyor olması gerekiyor.

Edit: soruyu tam anlamamışım. Sayfayı yenilediğinizde tekrar aktif olması için de COOKIE kullanabilirsiniz.

document.cookie = "aktifDiv=div"+div;
onload işleminden sonra

document.getElementById(getCookie("aktifDiv")).sty le.display = "block";


function getCookie(cname) {
let name = cname + "=";
let decodedCookie = decodeURIComponent(document.cookie);
let ca = decodedCookie.split(';');
for(let i = 0; i <ca.length; i++) {
let c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return"";
}

<button onclick="gizleGoster('div_1');">tıkla </button>
<button onclick="gizleGoster('div_2');">tıkla </button>
<button onclick="gizleGoster('div_3');">tıkla </button>
<button onclick="gizleGoster('div_4');">tıkla </button>
<button onclick="gizleGoster('div_5');">tıkla </button>

<div id="div_1" style="display:none;">Gizlenip gösterilen nesne1</div>
<div id="div_2" style="display:none;">Gizlenip gösterilen nesne2</div>
<div id="div_3" style="display:none;">Gizlenip gösterilen nesne3</div>
<div id="div_4" style="display:none;">Gizlenip gösterilen nesne4</div>
<div id="div_5" style="display:none;">Gizlenip gösterilen nesne5</div>



R10.net JavaScript Kodu

function gizleGoster(value){
for (let i = 1; i <= 5; i++) {
document.getElementById("div_"+i).style.display = "none";
}
document.getElementById(value).style.display = "block";
}


Bunu Yenilediğimde En son Gitiğim Divde Kalmasını İstiyorum