首页 > 代码库 > 父页面调用子页面的方法

父页面调用子页面的方法

其实一句话就可以调用子页面的方法了,何必整得那么纠结是吧,感谢java大神:

var dsjg1=document.getElementById("div-dsjg").contentWindow.checkEmpty();

我的子页面有一个方法:

子页面js:

function checkEmpty(){

  alert("我是儿子!");

} 

子页面body内容省略。

父页面:

    <iframe id="div-dsjg" src="http://www.mamicode.com/zi.html"></iframe>

    <input type="button" onclik="apprval();"/>

 

父页面的js:

function apprval(){

  var dsjg1=document.getElementById("div-dsjg").contentWindow.checkEmpty();

  alert("我是父亲!");

}

 

结果弹出为:

我是儿子!

我是父亲!

 

需要注意的是:如果你用的是iframe,则在加载子页面时,子页面里所有的东西都被加载,包括子页面的head、title、body等内容。

如果你用的纯粹的div打开,则只加载子页面的body内容,这时候,你就可以在父页面直接调用子页面的方法了!

可是有一天,你发现这个页面不是自己写的,但我实在是看不出到底是div打开的呢,还是iframe,你可以用360、谷歌浏览器调试一下,你就能看见到底用的是什么了。

父页面调用子页面的方法