前言及注意事项
背景:
在网上查阅了诸多相关介绍,大凡错误连篇或者是不能直达痛处;所以痛定思痛,自己写一篇相关记录,以备查用
注意事项
- 父页面调用子页面元素时,需要注意子页面是否加载完成,否则报错
测试结构说明
创建两个测试页面,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进行操作会莫名其妙的报错)```