js跨域问题之跨域iframe自适应大小
前几天做公司和开心网合作项目的时候 碰到iframe 跨域自适应的问题?
刚开始很迷惑 开心网那边技术工程师给我发了一段这样子的代码
<body onload="javascript: setHeight();">
<script>
function setHeight(){
?? ?var dHeight = document.documentElement.scrollHeight;
?? ?var t = document.createElement("div");
?? ?t.innerHTML = '<iframe id="kxiframeagent"
src="http://xxxx.kaixin001.com/xxx/xxx.html#'+dHeight+'"
scrolling="yes" height="0px" width="0px"></iframe>';
?? ?document.documentElement.appendChild(t.firstChild);
}
</script>
我想着跨域如何解决啊!后来去网上搜索了一下子? 恍然大悟
具体如下 我是复制过来了 大家重点理解一下子它的实现思路 :
?
?

iframe跨域自适应
问题:
A域名下的页面a.htm中通过iframe嵌入B域名下的页面b.html,由于b.html的大小等是不可预知而且会变化的,所以需要?a.htm中的iframe自适应大小.
问题本质?:
js的跨域问题,因为要控制a.htm中iframe的大小就必须首先读取得到b.html的大小,A、B不属于同一个域,js的访问受限,读取不到b.html的大小.
?
解决方案:
首先前提是A,B是合作关系,b.html中能引入A提供的js
?
首先a.html中通过iframe引入了b.html
Html代码
???
1
.?
<
iframe?id
=
"
aIframe
"
?height
=
"
0
"
?width
=
"
0
"
????
???
2
.?src
=
"
http://www.b.com/html/b.html
"
?frameborder
=
"
no
"
?border
=
"
0px
"
?marginwidth
=
"
0
"
???
???
3
.?marginheight
=
"
0
"
?scrolling
=
"
no
"
?allowtransparency
=
"
yes
"
?
><
/
iframe>??
免责声明: 本文仅代表作者个人观点,与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。