标签：main console 加载 域名 窗口 sel 通过 parent click
以下的父页面与子页面交互的方法必须起一个页面服务才能使用(通过域名来访问)并且的保证父页面与子页面是在同一域名下,不然是会报错的
父页面调用子页面
获取父页面的ifram的id或calss之后可以通过contentWindow这个对象获取子页面的元素和方法.父页面调用子页面的元素和方法时,必须要等iframe加载完毕,或者在onload 方法里执行,不然是获取不到的!
document.getElementById(‘main‘).contentWindow.document.querySelector(".warp");//获取父页面的方法
document.getElementById(‘main‘).contentWindow.childFn();//获取子页面的方法并执行
子页面调用父页面
在子页面通过window.parent.fn()可以获取并执行父页面的方法
window.parent.parentFn()
实例:
父页面
<iframe scrolling="no" id="main" name="main" frameborder="0" src="iframe子页面1.html"></iframe>
<script type="text/javascript">
//根据ID获取iframe对象
var ifr = document.getElementById(‘main‘);
ifr.onload = function() {
/*获取子页面的dom元素*/
var warp=ifr.contentWindow.document.querySelector(".warp"); //获取子页面的元素
console.log(warp);
ifr.contentWindow.childFn() //调用子页面的方法
}
function parentFn(){
alert("我是父页面的方法")
}
</script>
子页面
<p onclick="parentFn">购物车</p> <script> var box=document.querySelector("p"); box.onclick=function(){ window.parent.parentFn()//点击时调用父页面的方法 } function childFn(){ console.log("我是子页面的方法") } </script>
标签：main console 加载 域名 窗口 sel 通过 parent click
原文地址：https://www.cnblogs.com/zimengxiyu/p/12181207.html
