javascript/jquery对Iframe的操作详解

前言及注意事项

背景:
在网上查阅了诸多相关介绍,大凡错误连篇或者是不能直达痛处;所以痛定思痛,自己写一篇相关记录,以备查用
注意事项

• 父页面调用子页面元素时,需要注意子页面是否加载完成,否则报错

测试结构说明

创建两个测试页面,iframe1.html和iframe2.html
内容分别如下:
iframe1.html

iframe2.html

总结及归纳

1.无论是父页面调用子页面,还是子页面调用父页面,思想可以简单的归纳如下:
     获取父/子Iframe元素-->获取其window对象-->从而调用其内容dom和方法
2.子页面调用父页面,基本无争议,网上相关资料也得到证实
3.父页面调用子页面存在很多问题,网上资料查阅很多不可靠:
	1):父调子元素:
		JavaScript:
		document.getElementById("#父iframe").contentWindow.document.getElementById("子dom")
		jQuery:
		也只能用contentWindow,$("元素id")[0],将jquery对象转换为JavaScript对象使用,至于为什么jQuery的load无法使用,和其contents无法调用到方法,经过我查阅api大概了解到,因为jQuery无法获取到url,所以不能load而报错;希望以后我能解决
4.反正父调用子的整体思路就是:
通过js获取子iframe-->然后使用jquery进行操作(因为使用js进行操作会莫名其妙的报错)```