html中iframe父页面与子页面交互方法

js实现代码:

父页面获取子页面对象 

document.getElementById('child').contentWindow;  //child是iframe标签中的id

父页面调用子页面方法 

document.getElementById('child').contentWindow.childMethod(); //child是iframe标签中的id,childMethod是子页面中的方法

父页面获取子页面变量

document.getElementById('child').contentWindow.childVariable;  //child是iframe标签中的id,childVariable是子页面中的变量

子页面获取父页面对象

window.parent;  //获取上一级父类的对象

window.top;   // 获取顶级父类对象

子页面调用父页面方法

window.parent.parentMethod();

window.top.parentMethod(); //parentMethod父iframe中的方法

子页面获取父页面变量

window.parent.parentVariable;

 window.top.parentVariable; //parentVariable 是父页面中的变量

jquery实现代码：

父页面获取子页面对象

$("#child")  //child是iframe标签中的id

父页面操作子页面的元素

$("#child").find('#selector')  //child是iframe标签中的id,selector子页面选择器

父页面调用子页面的方法

$("#child")[0].contentWindow.childMethod();//child是iframe标签中的id,childMethod是子页面中的方法

子页面获取父页面对象

$(parent.document)

子页面操作父页面的元素

$('#selector',parent.document) //selector父页面选择器

个人理解欢迎大家指正！