首页 > 代码库 > iframe子页面，父页面相互调用（同域）
iframe子页面，父页面相互调用（同域）
先上代码：
父页面.html
<!DOCTYPE html><html><head> <title>父页面</title></head><body> <div id=‘parent‘></div> <iframe id="FrameId" name="frameName" frameborder="0" width="100%" height="100%;" src="../list"></iframe></body><script type="text/javascript"> var flag=20; //获得子页面id=children的div //javascript var chiDiv=document.getElementById(‘FrameId‘).contentWindow.document.getElementById(‘children‘); //jquery var chiDiv=$(‘#FrameId‘).contents().find(‘#children‘) //获得子页面js中的变量 var temp=document.frameName.temp;</script></html>
子页面.html
<!DOCTYPE html><html><head> <title>子页面</title></head><body> <div id=‘children‘></div></body><script type="text/javascript"> var temp=10; //获得父页面id=parent的div //javascript var parDiv=window.parent.document.getElementById(‘parent‘); //jquery var parDiv=$(window.parent.document).find(‘#parent‘); //获得父页面js中的变量 var flag=parent.flag;</script></html>
一、父页面调用子页面
1、先得到子页面的document
document.getElementById(‘FrameId‘).contentWindow.document
2、得到子页面的window
document.getElementById(‘FrameId‘).contentWindow.window
重载子页面：document.getElementById(‘FrameId‘).contentWindow.window.location.reload(true);
或者 $(‘#FrameId‘).attr(‘src‘,‘../list‘);
3、得到子页面的的变量
doucment. iframe的name属性值 . 子页面变量名称 （document.frameName.temp）
二、子页面调用父页面
1、父页面document ： window.parent.document
2、获得父页面变量 ： parent.变量名称
3、调用事件 ： window.parent.XXX();
iframe子页面，父页面相互调用（同域）
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。