问题：在A域中有文件A，A内嵌一个IFRAME（frame_a）,frame_a引用B域中的文件B。在B加载完成后，需要根据B的实际宽，高来确定frame_a的宽高，并剧中显示。于是，需要在文件B中操作frame_a，即存在跨域操作，而JS的安全机制是不允许跨域操作的。
解决思路：在B文件中，内嵌一个IFRAME(frame_b)。frame_b设置成不可见，并引用A域文件C。在文件C中通过parent.parent.document来获得文件A的文档对象。
文件A：
<html>
<head></head>
<body>
<iframe src="http://b/b.html"/>
<body>
</html>
文件B:
文件B通过引用A域的JS文件d.js来加载A域的文C
<html > <head> </head> <body style="margin: 0px;padding: 0px;background-color: white;"> <p>文件B </p> <script type="text/javascript" src="http://a/d.js"></script> </body> </html>
d.js:
function calcPageHeight(doc) {
var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight)
var sHeight = Math.max(doc.body.scrollHeight, doc.documentElement.scrollHeight)
var height = Math.max(cHeight, sHeight)
return height
}
function calcPageWidth(doc) {
var cWidth = Math.max(doc.body.clientWidth, doc.documentElement.clientWidth)
var sWidth = Math.max(doc.body.scrollWidth, doc.documentElement.scrollWidth)
var width = Math.max(cWidth, sWidth)
return width
}
window.onload = function() {
var doc = document ;
var height = calcPageHeight(doc) ;
var width = calcPageWidth(doc)
var myifr = doc.createElement("iframe");
doc.body.appendChild(myifr);
myifr.style.display="none";
if (myifr) {
myifr.src = 'http://a/c.html?height=' + height+'&width='+width;
}
};
文件C:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>C.html</title>
<script type="text/javascript" src="js/jquery-1.8.1.min.js"></script>
</head>
<body>
<script type="text/javascript">
window.onload = function() {
var isSet = false
var inteval = setInterval(function() {
var search = location.search.replace('?', '')
if (isSet) {
clearInterval(inteval)
return
}
if (search) {
var searchh=search.split('&')[0];
var searchw=search.split('&')[1];
var height = searchh.split('=')[1];
var width = searchw.split('=')[1];
var left=Math.max((window.screen.availWidth-width)/2,0);
var top=Math.max((window.screen.availHeight-height)/2,0);
var doc = parent.parent.document;
var ifr = doc.getElementById('adv')
$(ifr).animate({height:height+"px",width+"px",left:left+"px",top:top+"px"});
isSet = true
}
}, 500)
}
</script>
</body>
</html>