iframe多層巢狀時獲取元素總結

2021-08-20 10:21:48 字數 1719 閱讀 2987

同域:

注意:onload事件

jquery獲取:

$("iframe").contents().find("holder")......;

(巢狀三層,或者更多時)

$('iframe').contents().find('iframe').contents().find("iframe")......

js獲取:

window.frames["holder"].contentwindow.document 或者 window.frames[0].contentwindow.document(不推薦)

(巢狀三層,或者更多時)

window.frames[0].contentwindow.window.frames[0](......).contentwindow.document

補充拓展:(僅供參考)

document.frames 與 window.frames 之間的區別

document.frames 只有ie、opera 支援,等同於 window.frames。用來取得當前頁面內 window 物件的集合。

在 firefox、chorome、safari中使用 document.frames 不能獲取到 frame 元素

window.frames['myframe'] 代替 document.frames('myframe')或document.frames['myframe']。

注意:window.frames只可寫成window.frames['myframe']不能寫成window.frames('myframe')

子頁面獲取父頁面元素:

1、子頁面獲取iframe父頁面的dom

jquery獲取:

$("#holder",parent.document) 

js獲取:

parent.document.getelementbyid("holder")  

2、子頁面獲取父頁面裡的其他iframe子頁面裡的dom

jquery獲取:

$("#holder",window.parent.frames["holder"].document)

js獲取:

window.parent.frames["holder"].document.getelementbyid("holder")

補充拓展:(僅供參考)

opener 與 parent 之間的區別

opener:

opener用於在window.open的頁面引用執行該window.open方法的的頁面的物件。例如:a頁面通過window.open()方法彈出了b頁面,在b頁面中就可以通過opener來引用

a頁面,這樣就可以通過這個物件來對a頁面進行操作。

parent:

parent用於iframe,frame中生成的子頁面中訪問父頁面的物件。例如:a頁面中有乙個iframe或frame,那麼iframe或frame中的頁面就可以通過parent物件來引用a頁面

中的物件。這樣就可以獲取或返回值到a頁面中。

總結:parent指父視窗,在frameset中,frame的parent就是frameset視窗。 

opener指用window.open等方式建立的新視窗對應的原視窗。

parent是相對於框架來說父視窗物件。 

opener是針對於用window.open開啟的視窗來說的父視窗,前提是window.open開啟的才有。

iframe多層巢狀時,Jquery獲取元素

在專案中,尤其是後台管理專案,會使用到iframe巢狀的網頁,說起iframe,真的是個讓人頭疼的東西,能避開是最好避開。不然要請隨身備好氧氣瓶哈 因為管理和除錯過程中往往會被氣缺氧!哈哈哈 我們正常情況下獲取頁面的元素 class 或者document.getelementbyid 等,但是在有i...

多層iframe巢狀使用相互取值

父頁面獲取子頁面元素 注意 onload事件 jquery獲取 iframe contents find holder 巢狀三層,或者更多時 iframe contents find iframe contents find iframe js獲取 window.frames holder docu...

獲取Iframe中的元素

使用jquery在父視窗中獲取iframe中的元素 格式 iframe的id contents find iframe中控制項的id 事件 方式1 iframe中控制項的id document.frames iframe的name document 事情 方式2事例 iframeid content...