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')


子页面获取父页面元素：

 

第一、在iframe中查找父页面元素的方法：
$('#id', window.parent.document)

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

第三、在iframe中调用父页面中定义的方法和变量：
parent.method
parent.value

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

 

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

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打开的才有。

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