javascript - 持续更改 session 的 CSS

Question

我有一个 div (1) 带有 display:block，另一个 div (2) 带有 display:none 和第三个 div 也带有 display:none。

在每次点击或表单提交时，我想将第二个 div 的 display 更改为 block，将第一个更改为 none 。

虽然这可以使用 Javascript 完成，但我希望 CSS 的这种更改适用于特定 session 。我怎样才能做到这一点？

Answer 1

一种(虽然很老套)只使用客户端存储来做到这一点的方法是 SessionStorage .您可以在其中存储一些值，并根据该值设置页面加载时 div 的可见性。

/* When the user clicks the form */
sessionStorage.setItem("myValue", "showDiv2");

...    

/* When the page is loaded */
if (sessionStorage.getItem("myValue") === "showDiv2") {
    $('#div2').show();
    $('#div1').hide();
} else {
    $('#div1').show();
    $('#div2').hide();
}

没有办法持续修改css源，只能在dom加载后用javascript修改。