window.open传参唯一可靠方式是URL查询字符串，需encodeURIComponent编码特殊字符；超长或敏感数据应改用sessionStorage+同源校验，新窗口读取后立即removeItem清理。
用 window.open() 打开新页面后，怎么把值传过去？
不能靠 alert() 或 confirm() 传值——它们只是阻塞式 UI，不产生通信能力。真正能传值的是打开页面时的 URL 参数或 opener 引用。
最常用、最可靠的方式是拼接查询参数：
-
window.open("page2.html?user_id=123&role=admin")，然后在page2.html里用new URL(window.location).searchParams.get("user_id")拿值 - 如果值含特殊字符（比如空格、中文、
&），必须先encodeURIComponent()编码，否则参数截断或解析失败 - URL 长度有浏览器限制（通常 2000 字符以内），别传大对象或长文本
子页面想调用父页面的函数或变量，怎么安全访问？
子页面可通过 window.opener 获取父窗口引用，但有两个硬性前提：同源（协议、域名、端口全一致），且父页面没执行 window.opener = null 或开启 noopener。
- 父页打开时若写了
window.open(url, "_blank", "noopener")，子页的window.opener就是null，无法通信 - 同源下，子页可直接调用
window.opener.doSomething(data)，但要先判空：if (window.opener && window.opener.doSomething) { ... } - 父页函数需挂载到
window上（如window.receiveData = function(val) { ... }），否则闭包内不可见
跨域页面间怎么传值？postMessage 怎么写才不丢消息？
postMessage 是唯一被广泛支持的跨域通信方案，但它默认不校验来源，容易被恶意页面监听或伪造。
- 发送方必须指定目标窗口和精确的
targetOrigin（如"https://example.com"），千万别用"*" - 接收方必须检查
event.origin和event.source，只响应可信域名的消息：if (event.origin !== "https://trusted.com") return; - 消息是异步的，子页发完不能立刻假设父页已处理；如需确认，得设计应答机制（例如父页收到后
event.source.postMessage({ type: "ACK" }, event.origin)）
为什么刷新子页面后 window.opener 就失效了？
不是失效，是浏览器行为：只要子页面导航（包括刷新、跳转、history.pushState），window.opener 仍存在，但若父页面已关闭或刷新过，引用就变成“已断开”状态，调用方法会抛 DOMException: Blocked a frame with origin... 或静默失败。
- 不要依赖
window.opener的长期存活；适合一次性传值或短生命周期交互 - 需要持久通信？改用
localStorage+storage事件（仅同源）或服务端中转 - 调试时可用
console.log(window.opener?.location?.href)快速验证 opener 是否还活着
实际用的时候，多数人卡在 targetOrigin 写错、没做 origin 校验、或者忘了编码 URL 参数——这几个点漏掉一个，通信就看似“没反应”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
