思路:

现有主界面main在域a下,被嵌套页面B在域b下,被嵌套页面B又嵌套一个在域a下的中介页面A。

当用户打开浏览器访问mail.html的时候载入B,触发B的onload事件获取其自身高度,然后B载入A,并将高度值作为参数赋值给A的location对象。

这样A就可以通过location.hash获得B的高度。(location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url。

而location.hash则可以用来获取或设置页面的标签值。比如http://domain/#admin的location.hash="#admin"。利用这个属性值可以做一些非常有意义的事情。)。

由于A和main页面同域,所以可以修改main的dom节点属性,从而达到我们设置iframe标签高度的目的。

iframe主页面:main.html

<iframe id="iframeB"  name="iframeB" src="www.b.com/B.html" width="100%" height="auto" scrolling="no" frameborder="0"></iframe>

iframe嵌套页面:B.html

<iframe id="iframeA" name="iframeA" src="" width="0" height="0" style="display:none;" ></iframe>

<script type="text/javascript">

function sethash(){

    hashH = document.documentElement.scrollHeight; //获取自身高度

    urlC = "www.a.com/A.html"; //设置iframeA的src

    document.getElementById("iframeA").src=urlC+"#"+hashH; //将高度作为参数传递

}

window.onload=sethash;

</script>

中介页面:A.html

<script>
function pseth() {
var iObj = parent.parent.document.getElementById('iframeB');//A和main同域,所以可以访问节点
iObjH = parent.parent.frames["iframeB"].frames["iframeA"].location.hash;//访问自己的location对象获取hash值
iObj.style.height = iObjH.split("#")[1]+"px";//操作dom
}
pseth();
</script>

iframe跨域自适应高度的更多相关文章

  1. iframe 完全跨域自适应高度

    1.跨域访问页面, 需要访问后台的页面,通过后台调转 2.跨域自适应宽高   思路:通过相互嵌套,获取跨域页面的高度,通过src传回到本域,通过parent方法设置主页的iframe的高度 index ...

  2. iframe 跨域自适应 纯css解决方法

    <style type="text/css">body{background:#f00;}body, html,#ifm1{width:100%;height:100% ...

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

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

  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. js iframe跨域访问

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

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

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

  8. javascript跨域、iframe跨域访问

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

  9. iframe跨域cookie问题

    今天在项目里面遇到了iframe跨域不能写cookie的问题.应用场景是这样的:有A和B两个业务,A要通过iframe的方式嵌入B,但是在ie下A不能通过写cookie的方式记录信息,在firefox ...

随机推荐

  1. HDU 4596 Yet another end of the world (数学,扩展欧几里德)

    题意:给出n组x,y,z.判断是否存在一个id使得id%x1∈(y1,z1),id%x2∈(y2,z2). 析: 设 id/x1=a , id/x2=b ,则 id-a*x1=u;   (1) id- ...

  2. NS_ENUM & NS_OPTIONS

    When everything is an object, nothing is. So, there are a few ways you could parse that, but for the ...

  3. Computational Geometry Template_Polygon

    #include <stdlib.h> #include <math.h> #include <iostream> #define MAXN 1000 #defin ...

  4. UI进阶 科大讯飞(1) 语音听写(语音转换成文字)

    一.科大讯飞开放平台: http://www.xfyun.cn/ 注册.登录之后创建新应用. 因为本项目只实现了语音听写,所以在SDK下载中心勾选语音听写单项SDK就可以了 开发平台选择iOS,应用选 ...

  5. 待整理 - BAT文件编写

    BAT文件语法和技巧(bat文件的编写及使用)  http://www.jb51.net/article/5828.htm

  6. android 小方法

    小方法 1.获取屏幕分辨率: public class BaseTools { public static int getWindowWidth(Context context) { // 获取屏幕分 ...

  7. SQL SERVER 2005如何建立自动备份的维护计划

    SQL Server 2005中可以使用维护计划来为数据库自动备份,减少数据库管理员的工作负担.其使用方法如下: (1)启动[sql server Management Studio],在[对象资源管 ...

  8. C#调用webService的几种方法

    转自: WebClient 用法小结 http://www.cnblogs.com/hfliyi/archive/2012/08/21/2649892.html http://www.cnblogs. ...

  9. Centos下忘记mysql的root密码的解决方法

    Centos下忘记mysql的root密码的解决方法 一:(停掉正在运行的mysql) [root@NetDakVPS ~]# service mysql stop 二:使用 “--skip-gran ...

  10. List排序忽略大小写

    public List<String> sortListIgnoreCase(List<String> list) {        Collections.sort(list ...