Question

所以，我在我的测试网站上有这个奇怪的事情，我有每个“链接”（无论是菜单，按钮或任何东西）来显示/隐藏div而不是加载页面。非常基本对吗？除非我刷新页面，否则它将全部恢复到预期的主页。基于我的搜索答案，我想我必须使用本地/会话存储选项。会话听起来更好。

所以这是交易。我查看了sessionStorage上的w3schools页面，我了解它是如何工作的，但我不知道如何将它应用到我的页面。基本上，我页面上的每个链接都运行一个隐藏前一个div的函数，并显示一个包含内容的新函数。所以我在想，如果每次触发一个函数，它都会在var上存储一个值，该值将指定该函数作为最后使用的函数。然后以某种方式使用sessionStorage并使其工作，但我无法构建它。有什么帮助吗？

以下是我当前代码的简短示例。

EDITED

var state = null;
function show1() {
    state = "home";
    "use strict";
    document.getElementById('snow').style.display = "block";
    document.getElementById('btn').style.display = "none";
}


function ramble() {
    state = "ramble";
    "use strict";
    document.getElementById('ramble').style.display = "block";
    document.getElementById('snow').style.display = "none";
    document.getElementById('tex').style.display = "none";
}

基本上就是它。点击显示/隐藏。

Answer 1

您可以使用以下语法：

保存数据：

sessionStorage.setItem('key', 'value');

检索数据：

var data = sessionStorage.getItem('key');

更多信息和示例：https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

localStorage也是如此，但是你已经找到了持久性差异

Answer 2

我希望我的解决方案可以帮助您：如果您想保留JS更改，则需要使用 AJAX 将其保存到数据库，并更改页面架构和逻辑使用数据库中的数据。之后，即使您重新加载页面，您也会保留所有更改。

刷新后在DOM上保持JS更改

2 个答案: