iframe父子頁面通訊

1、同域下父子頁面的通訊

  1.父頁面調用子iframe頁面

   （1）經過iframe的Id獲取子頁面的dom，而後經過內置屬性contentWindow取得子窗口的window對象,此方法兼容各個瀏覽器

        document.getElementById('iframe_Id').contentWindow // contentWindow 不能省略

   （2）經過iframe的name直接獲取子窗口的window對象

        iframe_Name.window    //window能夠省略

   （3）經過window對象的frames[]數組對象直接獲取子frame對象

        window.frames[0] 或者 window.frames["iframe_Name"]

 2.子iframe頁面調用父頁面

   （1）經過parent或top對象獲取父頁面的window對象

        parent.window 或者 top.window //window 能夠省略

 3.主頁面內兄弟iframe頁面之間的相互調用

   （1）同域下各個iframe窗口之間的元素和方法能夠共享

 4.父頁面中檢測子iframe的加載狀況

   （1）子iframe的onload事件

 if (window.attachEvent) {//IE10及之前版本 document.getElementById('Id').attachEvent('onload', function () { mini.alert('IE'); }); } else if (window.addEventListener) {//全部主流瀏覽器除了IE10及之前版本 $('#Id')[0].addEventListener('load', function () { mini.alert('ss'); }); }   

   （2）使用定時器捕獲子iframe的加載狀態

var iFrm = document.getElementById('Id');
var fmState = function () {
    if(document.readyState){//document.readyState用於判斷文件是否加載完成，只讀，firefox不支持
       var state = iFrm.contentWindow.document.readyState;
       if(state == "complete"){ return;}
       window.setTimeout(fmState, 10);
     }
}
//在改變src或者經過form target提交表單時，執行語句：
if (fmState.TimeoutI){ window.clearTimeout(fmState.timeoutI);} 
fmState.timeoutI = window.setTimeout(fmState, 400);
註釋：
  1.延遲400毫秒的緣由？
  答：由於javascript對DOM的操做是異步的，咱們必須等待腳本對DOM落實執行後纔開始下一步。
  400秒這個數取決與客戶端的設備和瀏覽器的響應速度，好的設備的響應速度能在10毫秒之內甚
  至更快，但100毫秒左右可能比較大衆化，400毫秒應該是十分保守的了。
  總之，較大的毫秒數能適合更多的用戶設備情況，並能減小了客戶端設備的工做量。
    

 5.父頁面中刷新子頁面

   （1）document.getElementById().src=

2、跨域下父子頁面的通訊

  1.暫時未涉及待定