页面间传递window.answer值异常：跳转后为何为undefined？

嘿，这问题我碰到过好多次了！核心原因很简单：每个浏览器页面都有独立的运行上下文——你在第一个页面里给window.answer赋值，这个window是属于当前页面的专属对象。当你通过location.href跳转到answer.html时，原页面的上下文会被销毁，新页面会创建一个全新的window对象，之前存的值自然就带不过去啦。

下面给你几种靠谱的跨页面传值解决方案，按需选择就行：

1. URL 参数传递（最直观，适合非敏感的简单数据） #

把计算结果拼在跳转URL的查询参数里，能直接把数据暴露在地址栏中，适合不需要保密的简单值：

// 原页面代码
const myValue = 123; // 你的计算结果
location.href = `answer.html?answer=${encodeURIComponent(myValue)}`;

然后在answer.html里解析参数：

// answer.html 代码
const params = new URLSearchParams(window.location.search);
const answer = params.get('answer');
console.log(answer); // 会输出123

用encodeURIComponent是为了处理特殊字符（比如空格、中文），避免URL解析出错。

2. 使用 localStorage/sessionStorage（适合需要持久化或会话内共享的数据） #

如果数据不需要暴露在URL里，可以用浏览器的本地存储方案：

// 原页面代码
const myValue = 123;
localStorage.setItem('answer', myValue);
location.href = 'answer.html';

在answer.html里读取数据：

// answer.html 代码
const answer = localStorage.getItem('answer');
console.log(answer); // 输出123
// 用完建议删掉，避免数据残留
localStorage.removeItem('answer');

如果只想在当前浏览器会话（标签打开期间）保留数据，用sessionStorage代替localStorage即可，关闭标签后数据会自动清除。

3. Cookie（适合少量数据，旧项目兼容场景） #

虽然现在用得不多，但也是一种传统的跨页面传值方式，适合极小体积的数据：

// 原页面代码
document.cookie = `answer=${myValue}; path=/`;
location.href = 'answer.html';

在answer.html里解析Cookie：

// answer.html 代码
function getCookie(name) {
  const value = `; ${document.cookie}`;
  const parts = value.split(`; ${name}=`);
  if (parts.length === 2) return parts.pop().split(';').shift();
}
const answer = getCookie('answer');
console.log(answer);

内容的提问来源于stack exchange，提问作者Tosh