主頁面與包含的iframe頁面的互動操作

2021-07-05 01:09:30 字數 920 閱讀 7821

1、iframe子頁面呼叫 父頁面js函式

子頁面呼叫父頁面函式只需要寫上window.parent就可以了。比如呼叫a()函式,就寫成:

window.parent.a();

2、iframe父頁面呼叫 子頁面js函式

這個就稍微複雜一些,下面的方法支援ie和firefox瀏覽器:

document.getelementbyid('ifrtest').contentwindow.b();

元素和變數的相互訪問

1、子頁面訪問父頁面元素

parent.document.getelementbyid('id')和document相關的方法都可以這樣用

2、父頁面訪問子頁面元素

document.getelementbyid('iframeid').contentdocument.getelementsbytagname('table'); contentdocument後可以使用document相關方法

3、子頁面訪問父頁面js變數(注:父頁面的js變數需為全域性變數)

子頁面var variable = parent.variableparent   (variableparent為父頁面定義的變數)

4.父頁面訪問子頁面的js方法

window.frames["iframe的name屬性值"].***();

5、父頁面訪問子頁面js變數

在子頁面設定全域性變數比如childdbid,定義返回的函式

function nowchilddbid()

在父頁面

var childdbid=window.frames["iframe的name屬性值"].nowchilddbid;

js 主頁面給iframe巢狀頁面新增內容

此功能需要在服務環境下執行專案,否則可能會出現下面的報錯 如果報以上錯誤,把iframe和父頁面 都放入工程專案中在本地跑起來即可解決同源問題。js function getiframe id return document.getelementbyid id contentwindow.docum...

iframe子頁面與父頁面通訊

父頁面html iframe.html頁面 關鍵點 父親訪問孩子頁面 window framename 返回iframe頁面的window物件 js中定義的方法和變數都做為window物件的屬性存在 iframe訪問父親頁面 parent 代表父親的window物件 html和iframe的跨域通訊...

iframe 子頁面與父頁面通訊

iframe子頁面與父頁面通訊根據iframe中src屬性是同域鏈結還是跨域鏈結,通訊方式也不同。一 同域下父子頁面的通訊 父頁面呼叫子頁面方法 framename.window.childmethod 子頁面呼叫父頁面方法 parent.window.parentmethod 獲取到頁面的wind...