本文介绍了如何在网页中实现父页面向子页面传递数据（使用`postMessage`）和子页面向父页面响应（通过`addEventListener`）。详细展示了两个方向的数据交互实例，适用于前端开发者理解跨域通信技术。
1，父页面向子页面传递数据
<iframe id="myframe" frameborder="0" width="100%" ></iframe>父页面传值：
let parentData = {
page:"www.baidu.com",
name:"百度",
}
//向父页面传值
iframeWindow.postMessage(parentData, "*");
子页面接收数据:
window.addEventListener('message', (event) => {//子获取父消息
}, false);2,子页面向父页面传递数据
let parentData = {
page: "www.baidu.com",
name: "百度"
};
window.parent.postMessage(parentData, '*'); //子页面传值
window.addEventListener('message', (event) => {//父获取子消息
}, false);
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
