iframe多層嵌套時獲取元素總結

父頁面獲取子頁面元素：

注意：onload事件

jQuery獲取：
$("iframe").contents().find("holder")......;

（嵌套三層，或者更多時）
$('iframe').contents().find('iframe').contents().find("iframe")......


js獲取：
window.frames["holder"].document 或者 window.frames[0].document（不推薦）

（嵌套三層，或者更多時）
window.frames[0].window.frames[0](......).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中查找父頁面元素的方法：
$('#id', window.parent.document)

第2、在父頁面中獲取iframe中的元素方法：
$(this).contents().find("#suggestBox")

第3、在iframe中調用父頁面中定義的方法和變量：
parent.method
parent.value

 $(window.parent.document.body) //麻煩的方法：

 

 $($(window).eq(0)[0].parent.document).find('body'); ，忘了能夠用前面的方法了

一、子頁面獲取iframe父頁面的DOM

jQuery獲取：
$("#holder",parent.document) 

js獲取：
parent.document.getElementById("holder")  

二、子頁面獲取父頁面裏的其餘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打開的纔有。

原文地址： http://www.cnblogs.com/bugong/p/4057158.html