Javascript 本地存储存储多个div隐藏

我使用一个简单的代码来隐藏多个div，如果单击了隐藏它们的链接。 在其中一个上，我有本地存储设置来记住div是否隐藏。 事情是这样的。如何编写代码使本地存储记住多个div的隐藏状态，而不必为每个div放置localstorage.setItem。是否可以存储一个div id及其显示设置为true或false的数组，以决定页面是否应显示它们

************编辑***************

function ShowHide(id) {
if(document.getElementById(id).style.display = '') {
document.getElementById(id).style.display = 'none';
}
else if (document.getElementById(id).style.display = 'none') {
document.getElementById(id).style.display = ''; 
}

---

正如您所说，您已经有了一个存储所有状态的数组。您可以使用序列化并将结果放入

localStorage

 // your array
 var divstate = [ ... ];

 // store it
 localStorage.setItem( 'divstate', JSON.stringify( divstate ) );

如果要再次检索阵列，请使用：

编辑

要存储所有div的实际id，您可能会使用如下内容

var divstate = {
  'divid1': true,
  'divid2': false,
  ...
};

这可以很容易地与上述模式一起使用

第二次编辑

对于上面的代码，我建议使用上面的语句在页面加载时加载state变量一次

然后像这样变换函数：

function ShowHide(id) {
  var el = document.getElementById(id);

  if ( divstate[id] === true ) {
    divstate[id] = false;
    el.style.display = 'none';
  } else {
    divstate[id] = true;
    el.style.display = '';
  }

  localStorage.setItem( 'divstate', JSON.stringify( divstate ) );
}

这样，

divstate

就会随着每个函数调用而更新和存储

---

请注意，如果div的数量太多，我不建议这样做，但对于较小的div数量，这应该足够了。

您可能希望使用对象而不是数组。是否有示例代码？请参阅我的问题编辑，以查看我用于隐藏div的代码的草稿。我如何将本地存储与您的代码一起实现到其中呢？谢谢：D我将在我再次熟悉代码后立即试用。我会投票，但我没有声誉：(

function ShowHide(id) {
  var el = document.getElementById(id);

  if ( divstate[id] === true ) {
    divstate[id] = false;
    el.style.display = 'none';
  } else {
    divstate[id] = true;
    el.style.display = '';
  }

  localStorage.setItem( 'divstate', JSON.stringify( divstate ) );
}