单击链接然后按"返回"按钮后,保持DOM更改

Question

我正在使用jQuery的appendTo()方法将项目附加到无序列表.当用户单击另一个链接,然后按"返回"按钮时,附加的项目将消失.有没有办法使用JavaScript来持久化这些更改？

Answer 1

一旦用户离开页面，DOM 就会被丢弃。当您的用户点击后退按钮时，他们会从您的服务器（或其缓存）获取 HTML 的新副本。

因此，您有以下两种选择之一：

1. 正确的方法是将 DOM 状态保存在 cookie（或会话）中，然后在页面加载时检查该 cookie 是否存在，如果存在，则附加该信息。

2. 由于您没有提供足够的信息，我不太确定您想要完成什么。因此，如果 cookie 不够好，您可能必须将单击事件附加到链接，而不是仅仅将它们发送到该链接，您首先将 DOM 存储在变量中，然后加载到 HTMLvar theDOM = $('html').clone(true);中对于带有 AJAX 请求的链接。

您还必须通知浏览器您的历史记录状态已更改。这可以通过 HTML5 的新 History API 来完成。在旧版浏览器中，您可以通过 URL 的哈希部分执行类似的操作（尽管在旧版 IE 中，这甚至不起作用）。然后，当用户单击后退按钮时，您将从变量中重新加载该 DOM...

无论哪种方式，这都太复杂了。您可能以错误的方式看待这个问题。你想达到什么目的？