iframe 跨域自适应高度
1。引入的跨域文件content.html
内容：
<html>
<head>
<title>content</title>
<script type="text/javascript" src="http://www.king.com/demo/iframe.js"></script>
</head>
<body>
<p>1</p>
<p>2</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
</body>
</html>
2。主页面main.html
<html>
<head>
<title>main</title>
</head>
<body>
<iframe id="content" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" src="http://www.king.com/demo/content.html"></iframe>
</body>
</html>
3。跨域文件要引入的js文件iframe.js
window.onload = function() {
var iframe = document.createElement("iframe");
iframe.style.display = "none";
iframe.src = "http://www.jinxin.com/demo/proxy.html?width=" + document.body.scrollWidth + "&" + "height=" + document.body.scrollHeight;
document.getElementsByTagName("body")[0].appendChild(iframe);
}
4。跨域用于代理的页面proxy.html
<html>
<head>
<title>proxy</title>
</head>
<body>
<script>
var query = location.search.substring(1).split("&");
for (var i = 0; i < query.length; i++) {
var param = query[i].split("=");
switch (param[0]) {
case "width":
parent.parent.document.getElementById("content").width = param[1];
break;
case "height":
parent.parent.document.getElementById("content").height = param[1];
break;
}
}
</script>
</body>
</html>
内容：
<html>
<head>
<title>content</title>
<script type="text/javascript" src="http://www.king.com/demo/iframe.js"></script>
</head>
<body>
<p>1</p>
<p>2</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
<p>5</p>
</body>
</html>
2。主页面main.html
<html>
<head>
<title>main</title>
</head>
<body>
<iframe id="content" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" src="http://www.king.com/demo/content.html"></iframe>
</body>
</html>
3。跨域文件要引入的js文件iframe.js
window.onload = function() {
var iframe = document.createElement("iframe");
iframe.style.display = "none";
iframe.src = "http://www.jinxin.com/demo/proxy.html?width=" + document.body.scrollWidth + "&" + "height=" + document.body.scrollHeight;
document.getElementsByTagName("body")[0].appendChild(iframe);
}
4。跨域用于代理的页面proxy.html
<html>
<head>
<title>proxy</title>
</head>
<body>
<script>
var query = location.search.substring(1).split("&");
for (var i = 0; i < query.length; i++) {
var param = query[i].split("=");
switch (param[0]) {
case "width":
parent.parent.document.getElementById("content").width = param[1];
break;
case "height":
parent.parent.document.getElementById("content").height = param[1];
break;
}
}
</script>
</body>
</html>