javascript - 更改 div 类 onclick --- 并*保存*更改

Question

有很多问题询问如何在 JavaScript 单击处理程序中更改 div 的类，例如，此处:Change Div style onclick .我理解得很好(只需更改 .className)，并且它有效。

但是，当我从我的页面点击一个链接到其他地方，然后单击后退按钮时，类名被还原。 (Safari 和 Firefox 做对了，Chrome 没有。)在 Chrome 中，我动态进行的大多数其他更改，例如单击处理程序，在我返回页面时也会还原(尽管它记得新插入的新 div)。

请注意，当我按“后退”时，Chrome 和其他浏览器都不会重新加载页面；他们必须从缓存中取出它。 (我使用 ajax 更新服务器上的状态，因此当浏览器重新加载页面时它工作正常。)

我不是真正的网络开发人员，所以这有点令人费解。这里的标准做法是什么？每次更改 div 时都应该使用 history.replaceState() 吗？我是否应该将更改保存在状态变量中并在每次出现 popstate 事件时重新加载它们？我是否应该删除 div 并插入一个新的(包含所有旧 div 的子项)而不是更改 div 类名？

我在这里使用的是 vanilla JavaScript(甚至没有 jquery)，如果可能的话，我更愿意保持这种状态。

Answer 1

这是可能的，但你需要额外的方式来记住它

您可以尝试以下方法之一:

Cookies:这绝对是最好的方式

在 URL 上传递变量:示例:www.mywebsite.com?myvar=red。使用 PHP 会更容易，但在纯 JS 中仍然可行(但我不推荐)

将其存储在数据库中:(完全不推荐这样做)

将其存储在输入元素中:在当前的浏览器中，输入元素值(单选按钮、隐藏等)在 POST 后保留，并使用后退按钮返回。

这些只是一些选择，但我不建议将它们用于你想要的(如果你权衡你想做的事情的利弊，那是浪费时间和精力)