Javascript：打开隐藏和显示切换按钮<；td>；在加载页面时恢复

我有一个场景，比如，在我的jsp页面中有一个普通的标记，一旦单击一个超链接，我需要在它们之间切换hide-n-show。我使用纯javascript函数（而不是jQuery）进行了切换，它工作正常

但我面临的问题是，在中执行某些操作时，它用于重新加载页面，因此它会重置切换状态

jsp中的代码（带有自定义标记）是：

我希望我能把我的问题说清楚。如果您能给出任何建议，即使在页面重新加载后仍保持切换状态，这将非常有用。

---

谢谢。

我举了一个本地存储的例子。 我希望我能帮上忙

// First check if there is data saved in localStorage
var retrievedData = localStorage.getItem("localStorageMyData");

// ...and if there is data execute them
if (retrievedData) {
    var myValue = JSON.parse(retrievedData);
    var id1 = myValue.id1;
    var id2 = myValue.id2;

    document.getElementById('id1').setAttribute('style', id1);
    document.getElementById('id2').setAttribute('style', id2);
}

function toggleTable() {

    if (document.getElementById('id1').style.display == 'none') {
        document.getElementById('id2').style.display = 'none';
        document.getElementById('id1').style.display = 'block';
    } else {
        document.getElementById('id1').style.display = 'none';
        document.getElementById('id2').style.display = 'block';
    }

    // The information is saved in localStorage with each click
    var id1 = document.getElementById('id1').getAttribute("style");
    var id2 = document.getElementById('id2').getAttribute("style");

    var myValue = ({ id1: id1, id2: id2 });
    localStorage.setItem("localStorageMyData", JSON.stringify(myValue));
    
}

---

在页面加载时还原

-因为在重新加载页面时页面所处的状态没有内存，所以您可以给出任何代码示例，如何获取该状态内存。谢谢。您可以使用

cookies

，或者最好使用

sessionStorage

或

localStorage

-取决于您如何存储和检索它-也就是说，您想存储和检索什么取决于您自己好的，我需要将值存储在

sessionStorage

或

localStorage

中以检索它。有两种方法：将状态保存在会话存储或本地存储或数据库中；单击“重新加载”按钮，仅重新加载目标内容，而不是整个页面。我很高兴我能帮上忙：）你可以把这个答案标记为接受答案。

function toggleTable(){
    
    if( document.getElementById('id1').style.display == 'none' ){
       document.getElementById('id2').style.display = 'none';
       document.getElementById('id1').style.display = 'block';
     } else{
       document.getElementById('id1').style.display = 'none';
       document.getElementById('id2').style.display = 'block';
    }
    
}

// First check if there is data saved in localStorage
var retrievedData = localStorage.getItem("localStorageMyData");

// ...and if there is data execute them
if (retrievedData) {
    var myValue = JSON.parse(retrievedData);
    var id1 = myValue.id1;
    var id2 = myValue.id2;

    document.getElementById('id1').setAttribute('style', id1);
    document.getElementById('id2').setAttribute('style', id2);
}

function toggleTable() {

    if (document.getElementById('id1').style.display == 'none') {
        document.getElementById('id2').style.display = 'none';
        document.getElementById('id1').style.display = 'block';
    } else {
        document.getElementById('id1').style.display = 'none';
        document.getElementById('id2').style.display = 'block';
    }

    // The information is saved in localStorage with each click
    var id1 = document.getElementById('id1').getAttribute("style");
    var id2 = document.getElementById('id2').getAttribute("style");

    var myValue = ({ id1: id1, id2: id2 });
    localStorage.setItem("localStorageMyData", JSON.stringify(myValue));
    
}