首页 >web前端 >js教程 >js iframe跨域访问(同主域/非同主域)分别深入介绍_javascript技巧

js iframe跨域访问(同主域/非同主域)分别深入介绍_javascript技巧

WBOY
WBOY原创
2016-05-16 17:43:012098浏览

js跨域是个讨论很多的话题。iframe跨域访问也被研究的很透了。
一般分两种情况
一、 是同主域下面,不同子域之间的跨域
  同主域,不同子域跨域,设置相同的document.domian就可以解决;
父页访问子页,可以document.getElementById("myframe").contentWindow.document来访问iframe页面的内容;如果支持contentDocument也可以直接document.getElementById("myframe").contentDocument访问子页面内容;
  子页访问父页,可以parent.js全局属性
二、 是不同主域跨域
  前提,www.a.com下a.html,a.html内iframe调用了www.b.com下的b.html,b.html下iframe调用了www.a.com下的c.html
  b.html是不无法直接访问a.html的对象,因为涉及到跨域,但可以访问parent,同样c.html的parent可以访问b.html。c.html和a.html同域,是可以访问a下的对象的。parent.parent.js对象!
  看下面实例:
  a.html

复制代码 代码如下:





无标题文档




    <script> <br>function dosome(text){ <br>document.getElementById("getText").innerHTML= decodeURI(text); <br>} <br></script>



    b.html
    复制代码 代码如下:





    无标题文档




    • 这里是内容1

    • 这里是内容2

    • 这里是内容3

    • 这里是内容4

    • 这里是内容5

    • 这里是内容6


    <script> <br>window.onload = function(){ <br>var text = document.getElementById('ct').innerHTML; <br>document.getElementById('myfarme').src="http://www.a.com/c.html?content=" encodeURI(text); <br>} <br></script>



    c.html
    复制代码 代码如下:





    无标题文档
    <script> <br>window.onload = function(){ <br>var text = window.location.href.split('=')[1] <br>console.log(parent.parent) <br>parent.parent.dosome(text); <br>} <br></script>


    ddddddddddd


    声明:
    本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn