iframe中父子窗口的调用
生活随笔
收集整理的這篇文章主要介紹了
iframe中父子窗口的调用
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
一、iframe標簽詳解
<iframe src="1.html" frameborder="0" id="child"></iframe>(1)操作子窗口：frames['child'].contentDocument || frames['child'].document
1.首先獲取iframe節點：
var myIframe = document.getElementById('child'); 或 var myIframe = frames['child']; 或 var myIframe = window.frames['child']; 或 var myIframe = child;window對象的frames屬性返回一個類似數組的對象，成員是所有子窗口的window對象。比如，frames[0]返回第一個子窗口。如果iframe設置了id或name，那么屬性值會自動成為全局變量，并且可以通過window.frames屬性引用，返回子窗口的window對象。
window.frames['child'] === frames['child'] === child === document.getElementById('child');2.然后獲取iframe包含的document對象:
IE瀏覽器：
var childDocument = myIframe.document;其他瀏覽器：
var childDocument = myIframe.contentWindow.document; 或 var childDocument = myIframe.contentDocument;contentWindow屬性獲得iframe節點包含的window對象，
contentDocument屬性獲得包含的document對象，等價于contentWindow.document
注意：iframe元素遵守同源政策，只有當父頁面與框架頁面來自同一個域名，兩者之間才可以用腳本通信，否則只有使用window.postMessage方法。
(2)操作父窗口：iframe.parent
iframe窗口內部，使用window.parent引用父窗口。如果當前頁面沒有父窗口，則window.parent屬性返回自身。因此，可以通過window.parent是否等于window.self，判斷當前窗口是否為iframe窗口。
if (window.parent !== window.self) {//當前窗口是子窗口var parentDocument = window.parent.document; }二、iframe中父子窗口操作實例
父頁面：
<body> <div id="myList"> </div> <iframe src="1.html" frameborder="0" id="child"></iframe> </body>子頁面：
<body> <div id="content"> 這是子頁面 </div> </body>父頁面調取子頁面內容：
frames['child'].onload = function () {var childDocument = this.contentDocument || this.document; }子頁面調取父頁面內容：
if (window.parent !== window.self) {var parentDocument = window.parent.document; }總結
以上是生活随笔為你收集整理的iframe中父子窗口的调用的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： ICC_lab总结——ICC_lab2：
- 下一篇： ios 获取视频截图