父窗体
<html> <head> <title>usually function</title> </head> <body> <iframe src="http://www.baidu.com" ></iframe> <iframe src="myifame.html" id="name_iframe" name="name_iframe"></iframe> <button value="buttonvalue" id="testid">buttonvalue</button> </body> <html> <script type="text/javascript" src="jquery-1.4.4.js"></script> <script> //contentwindow这个属性，相当于获取iframe网页里面的window对象 $(function(){ //父窗体获取子窗体的变量 alert(document.getelementbyid(name_iframe).contentwindow.vname);//父窗体获取子窗体的方法 document.getelementbyid(name_iframe).contentwindow.test();//父窗体获取子窗体的内容 alert(document.getelementbyid(name_iframe).contentwindow.document.body.outerhtml); }); var myname=hb; function parentfunction(){ alert(parentfunction); } </script>
子窗体
<html> <head> <title>usually function</title> </head> <body> <button onclick="getparentcontent()">getparentcontent</button> </body> <html> <script type="text/javascript" src="jquery-1.4.4.js"></script> <script> var vname=v_name; function test(){ alert(function test); } function getparentcontent(){ //获取父窗体的变量 alert(window.parent.myname); //获取父窗体的方法 window.parent.parentfunction(); //获取父窗体的dom节点 alert(parent.document.getelementbyid(testid).value); } </script>
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
iframe怎样实现触发父窗口元素事件
js+jquery库实现iframe高宽自适应（附代码）
以上就是iframe父与子窗体相互调用（附代码）的详细内容。