Heim > Web-Frontend > js-Tutorial > js iframe跨域访问(同主域/非同主域)分别深入介绍_javascript技巧

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

WBOY
Freigeben: 2016-05-16 17:43:01
Original
2095 Leute haben es durchsucht

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


    Verwandte Etiketten:
    Quelle:php.cn
    Erklärung dieser Website
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage