JavaScript跨文档通信：子页面操作父页面元素
在网页开发中，我们经常使用Iframe来嵌入其他页面。这就会涉及到子页面与父页面之间的数据交互，例如获取父页面的变量或操作父页面的DOM元素。
实现这种跨文档通信的关键在于window.parent属性。子页面可以通过window.parent访问父页面的window对象，从而获取父页面的变量、函数以及操作父页面的DOM元素。
需要注意的是，为了安全起见，浏览器施加了同源策略。只有当子页面和父页面的协议、域名和端口号完全一致时，子页面才能通过window.parent访问父页面的内容。
以下是一些常用的跨文档通信方法：
- 获取父页面变量：
const parentVariable = window.parent.variableName; - 调用父页面函数：
window.parent.functionName(arg1, arg2); - 操作父页面DOM元素：
const parentElement = window.parent.document.getElementById('parentElementId');
在实际应用中，我们需要根据具体需求选择合适的跨文档通信方式，并注意处理好跨域问题。
文件大小：34.43KB
评论区