javascript - 如何使用Javascript在两个页面之间传递数据

Question

我在 SO 上看到了与此类似的其他几个问题，但它们都不是我真正想要的，所以希望这不会被视为重复。

我有一个使用 jQuery Mobile 构建的客户端 Javascript/HTML5 Web 应用程序。我发现性能可能会很慢，并且有人认为 DOM 中发生的事情太多可能是原因。我的应用程序确实有几个data-role="page"div 可以在单个 html 页面中增加 DOM。我正在尝试将我的应用程序拆分为几个 html 页面以提高性能，但我希望用户的体验是无缝的。这意味着我需要在我的应用程序中的物理 html 页面之间传递 Javascript 变量。

到目前为止，我在搜索中看到了以下选项：

1. 在转到其他页面的 url 中使用查询字符串。- 我不确定我是否希望我的用户在地址栏中看到一个相当大且令人困惑的查询字符串。
2. 使用像 ASP.Net 或 PHP 这样的服务器端代码来处理回发数据。- 我对此持开放态度，但我不确定它会如何工作。我不想将我的 html 页面转换为 aspx 或 php 文件。我可以有一个简单的服务器端脚本，可以将回发数据嵌入到常规的 html 文件中吗？
3. 使用 Cookie 存储相关数据。- 我也不确定这一点，因为我的大多数用户都在可能限制 cookie 使用的企业环境中。

有没有其他方法可以做到这一点？在这一点上，我倾向于某种服务器端处理。如果这是最好的方法，有人能指出我正确的方向来弄清楚如何做到这一点吗？

Answer 1

Try out Local Storage or Session Storage http://www.w3schools.com/html/html5_webstorage.asp

Answer 2

如果您符合 HTML5，本地存储将是一种可行的方法。它将存储值，减少对任何服务器的调用，直到您真正准备好更新所有信息并且即使关闭浏览器，信息也会出现；像这样使用会话存储或 JS

window.onbeforeunload = function() {
  localStorage.removeItem(key);
  return '';
};

如果您需要在关闭浏览器时清除本地存储的敏感信息。

请记住，您传递到本地存储的任何内容都将以字符串形式出现，因此当您从存储中获取信息时，您需要将其转换为适当的数据类型。

您还将被限制为存储 5 兆数据（我相信这是标准的），但如果您的表单需要这么多信息，您可能还会遇到其他问题。:)

查看这些以获取更多信息

http://msdn.microsoft.com/en-us/library/bg142799(v=vs.85).aspx

http://dev.w3.org/html5/webstorage/

Answer 3

如果您只关心 GET 是用户看到冗长的查询字符串，则可以使用 POST 而不是 GET。

Answer 4

使用本地存储。localStorage 允许您在浏览器中存储值。