JS代码中实现IFrame内外页面的互访问

最新推荐文章于 2023-12-27 14:49:44 发布

原创最新推荐文章于 2023-12-27 14:49:44 发布 · 616 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#iframe #html

main.html

1 <html>
2 <head>
3     <title>MAIN</title>
4     <script type="text/javascript">
5         // 主页面访问IFrame页面DOM内容
6         function oinit() {
7             alert(getIFrameDoc("iframe1").getElementById("idiv").id);
8         }
9         function getIFrameDoc(id) {
10             var iframe = document.getElementById(id);
11             var doc = (iframe.contentWindow || iframe.contentDocument);
12             if (doc.document) {
13                 doc = doc.document;
14             }
15             return doc;
16         }
17     </script>
18 </head>
19 <body onload="oinit()">
20     <div id="odiv">
21         <iframe id="iframe1" src="iframe.html"></iframe>
22     </div>
23 </body>
24 </html>

iframe.html

1 <html>
2 <head>
3     <title>IFRAME</title>
4     <script type="text/javascript">
5         // IFrame页面访问外层页面DOM内容
6         function iinit() {
7             alert(window.parent.document.getElementById("odiv").id);
8         }
9     </script>
10 </head>
11 <body onload="iinit()">
12     <div id="idiv">
13 </body>
14 </html>