iframe子頁面和父頁面如何傳值通訊

2021-09-25 02:21:09 字數 592 閱讀 3804

業務場景,在index.html的主頁面中,我們希望巢狀子頁面,這時候就涉及到父子頁面的通訊問題。

以下的都是在同域的基礎上的:

1.相互獲取dom元素

1.1 在父頁面獲取子頁面的dom元素:

document.getelementbyid('iframe_id).contentwindow.document.getelementbyid('domid');

//先獲取iframe的id,再在iframe所在的document找dom元素,根據id查詢;

1.2 子頁面獲取父頁面的dom元素

window.parent.document.getelementbyid('mask_id');  可以回到父頁面
2.相互呼叫方法

父頁面呼叫子頁面方法:iframename.window.childmethod();

子頁面呼叫父頁面方法:parent.window.parentmethod();

3.相互呼叫變數

子頁面訪問父頁面變數:parent.父頁面變數;

父頁面訪問子頁面變數: document.getelementbyid('iframe_id).子頁面變數;

子頁面如何呼叫 關閉父頁面layer

在專案開發中,有時候操作子頁面需要在父頁面層級呼叫layer提示,如下圖 在子頁面執行了某個操作後給出layer提示,整個專案都被禁用,要等載入完成之後在關閉layer提示 html button id prohibit style display none button button id rem...

iframe子頁面操作父頁面

最近經常用到iframe,用的最多的就是在子頁面中操作父頁面的方法或變數等,總結了用到的幾種方法,如下 var htmlurl window.parent.main frame attr src jquery 獲取父頁面的iframe的src屬性值 其實獲取父頁面的乙個引數或方法有很多種的寫法,現在...

如何實現 iframe 子頁面和父頁面聯調?

目錄通過 chrome 開發者工具編輯 iframe src 的方式來達到實時預覽,然後過載 iframe 來看最新效果 為已有系統擴充套件乙個 iframe 子頁面,該子頁面風格比較獨特,又需要讓子頁面在系統和諧融入時,用來除錯可以節省大量時間,比從頭搭框架要來的快得多 就比如我有乙個藍色調的後台...