重点分析:

主域名页面:页面A,页面C

其它域名页面:页面B

步骤:

1、页面A(主域名)通过Iframe(id="iframeB")嵌套页面B(其它域名)

2、页面B(其它域名)获取自身高度值pageB_height,再通过Iframe(id="iframeA")嵌套页面C同时传自身高度值pageB_height给页面C

3、因为页面C和页面A同域名,所以可以在页面C中获取页面A的Iframe(id="iframeB"),并将页面A中的iframeB的高度值设为pageB_height

中间页面C(主域名):http://www.main.com/setheight.aspx

<html><head><title>JavaScript使跨域Iframe自动适应高度中间页面</title>
<script type="text/javascript">
function pseth() {
var iObj = window.parent.parent.document.getElementById('iframeB'); //A和main同域,所以可以访问节点
var iObjH = "";
try {
iObjH = window.parent.parent.frames["iframeB"].frames["iframeA"].location.hash; //访问自己的location对象获取hash值
} catch (e) {
iObjH = window.location.toString();
} var arr = iObjH.split("#")[1];
var arrPasearr = arr.split("|");
// alert(arrPasearr[0]);
iObj.style.height = arrPasearr[0] + "px"; //操作dom if (arrPasearr[1] != undefined && arrPasearr[1] != "")
window.parent.parent.document.title = decodeURI(arrPasearr[1]) + '-吉运商城';
}
try {
pseth();
} catch (e) {
}
</script>
</head><body></body></html>

 //code by:博客园-曹永思 

主页面A(主域名):http://www.main.com/index.aspx

<html><head><title>主页面</title>
</head><body>
<iframe id="iframeB" src="http://b.main.com/index.html" scrolling="no" width="100%" height="1000px" frameborder="0" marginwidth="0" marginheight="0"></iframe>
</body></html>

  

嵌套的页面B(其它域名): http://b.main.com/index.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>嵌套在Iframe里的页面</title>
</head>
<body bgcolor="#f1e7de">
<iframe id="iframeA" name="iframeA" src="" width="0" height="0" style="display:none;" ></iframe>
</body>
<script type="text/javascript">
function sethash() {
var hashH = document.documentElement.scrollHeight; //获取自身高度
var urlC = "http://www.main.com/setheight.aspx"; //设置iframeA的src
document.getElementById("iframeA").src = urlC + "#" + hashH + "|"; //将高度作为参数传递
}
window.onload = sethash;
</script>
</html>

  

Iframe跨域JavaScript自动适应高度的更多相关文章

  1. Iframe跨域嵌入页面自动调整高度的办法

    http://www.a.com/A.html http://www.a.com/B.html http://www.a.com/D.js http://www.c.com/C.html A.html ...

  2. 解决Iframe跨域高度自适应,利用window.postMessage()实现跨域消息传递页面高度(JavaScript)

    在iframe跨域引用高度自适应这块写的js方式都试了不管用,最终使用的是window.postMessage() 跨域获取高度 传递信息 1.首先,在主页面上使用iframe引入子页面:也就是A.h ...

  3. javascript跨域、iframe跨域访问

    1.window 对象 浏览器会在其打开一个 HTML 文档时创建一个对应的 window 对象.但是,如果一个文档定义了一个或多个框架(即,包含一个或多个 frame 或 iframe 标签),浏览 ...

  4. IFrame跨域访问自定义高度

    由于JS禁止跨域访问,如何实现不同域的子页面将高度返回给父页面本身,是解决自定义高度的难点. JS跨域访问问题描述:应用A访问应用B的资源,由于A,B应用分别部署在不同应用服务器(tomcat)上,属 ...

  5. IFrame跨域访问&&IFrame跨域访问自定义高度

    1.IFrame跨域访问: http://blog.csdn.net/fdipzone/article/details/17619673 2.IFrame跨域访问自定义高度: 由于JS禁止跨域访问,如 ...

  6. 关于iFrame特性总计和iFrame跨域解决办法

    1.iframe 定义和用法 iframe 元素会创建包含另外一个文档的内联框架(即行内框架). HTML 与 XHTML 之间的差异 在 HTML 4.1 Strict DTD 和 XHTML 1. ...

  7. CP="CAO PSA OUR" 用P3P header解决iframe跨域访问cookie

    1.IE浏览器iframe跨域丢失Session问题 在开发中,我们经常会遇到使用Frame来工作,而且有时是为了跟其他网站集成,应用到多域的情况下,而Iframe是不能保存Session的因此,网上 ...

  8. js iframe跨域访问

    1.什么是跨域? 2.前台解决跨域几种方法 2.1 动态创建script 2.2 使用document.domain 2.3使用HTML5新属性postMessage 2.4 利用iframe和loc ...

  9. JS跨域(ajax跨域、iframe跨域)解决方法及原理详解(jsonp)

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

随机推荐

  1. 通过java.net.URLConnection发送HTTP请求(原生、爬虫)

    目录 1. 运用原生Java Api发送简单的Get请求.Post请求 2. 简单封装 3. 简单测试 如何通过Java发送HTTP请求,通俗点讲,如何通过Java(模拟浏览器)发送HTTP请求.Ja ...

  2. [z]分区truncate操作的介绍及对全局索引和空间释放影响的案例解析

    [z]https://www.2cto.com/database/201301/181226.html 环境: [sql] [oracle@localhost ~]$ uname -r 2.6.18- ...

  3. mysql-mysqldump命令导出多个数据库结构(实战)

    环境:windows server 2012 打开CMD命令行模式, >cd c:\Program Files\Mysql\Mysql 5.7.1\bin c:\Program Files\My ...

  4. python loggin

    一 日志级别 CRITICAL = 50 #FATAL = CRITICAL ERROR = 40 WARNING = 30 #WARN = WARNING INFO = 20 DEBUG = 10 ...

  5. table-layout 显示规则以及其他一些零碎的东西

    首先对中文显示的不够好 对中文失效  auto是表格的宽和高都会随着内容增多而改变  而fixed只会增加表格的高度   宽度不会发生改变  table中的td的宽,高会根据内容的多少而变化: fix ...

  6. jquery 进阶 bootstrap

    . 样式操作 . 操作class . 操作CSS属性的 .css("color") .css("color", "green") .css( ...

  7. c#devexpress GridContorl添加进度条

    demo 的实现图 下边是步骤和代码 1定义 时钟事件,定时的增加进度条的增量. 2:  添加进度条 3;定义字段属性 using System; using System.Collections.G ...

  8. PAT 1067 试密码(20)(代码)

    1067 试密码(20 分) 当你试图登录某个系统却忘了密码时,系统一般只会允许你尝试有限多次,当超出允许次数时,账号就会被锁死.本题就请你实现这个小功能. 输入格式: 输入在第一行给出一个密码(长度 ...

  9. 添加exe为windows service服务

    [方法一] 一.介绍 srvany.exe是Microsoft Windows Resource Kits工具集的一个实用小工具,用于将EXE程序作为Windows服务运行.srvany是其注册程序的 ...

  10. django数据库多对多修改对应关系

    obj = models.Book.objects.get(id=1) #添加对应关系,给书添加作者# obj.m.add(3)# obj.m.add(2,4)# obj.m.add(*[1,2,3, ...