JavaScript中Iframe父子页面元素与方法调用指南

作者:像素漫游

时间:2026-10-27

浏览:436

本文详解JavaScript中Iframe与父页面之间的交互方法。重点介绍如何在子页面通过window.parent获取父页面document对象及调用其JS方法,以及在父页面中通过contentWindow属性访问子页面document对象,实现双向数据与功能通信。

文章目录

子页面访问父页面元素与方法

1. 在Iframe子页面中获取父页面的元素:

a. 使用 window.parent.document 可以获取父页面 document 中的对象;

b. 若要调用父页面 JavaScript 中的方法,可使用 window.parent.xxxx();其中 xxxx() 代表父页面中定义的具体方法名;

父页面访问子页面元素

2. 在父页面中获取Iframe子页面中的元素:

a.

var child = document.getElementByIdx_x("mainFrame").contentWindow; // mainFrame 是父页面中 Iframe 元素的 id 属性值

child.document; // 通过 child 对象获取子页面中的 document 对象;

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章