跨域和非跨域 获取iframe页面高度的方法

跨域方法:

第一步,在主页面里插入代码:
//假设主域名是www.aaa.com  需要插入的跨域域名为www.bbb.com

<iframe src="http://www.bbb.com/index.html" width="100%" height="100%" id="iframepage" name="iframepage" onLoad="iFrameHeight()" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>

<script type="text/javascript">
function iFrameHeight() {
var iObj = parent.parent.document.getElementById(‘iframepage‘);
iObjH = parent.parent.frames["iframepage"].frames["MiddleIframe"].location.hash;
iObj.style.height = iObjH.split("#")[1] + "px";
}
</script>

第二步,在跨域页面里(http://www.bbb.com/index.html)插入代码:
//需要在www.aaa.com下新建一个分目录/kuayu下的autoheight.html空文件,否则如果在根目录下建立html文件不确定会不会成功!

<iframe id="MiddleIframe" name="MiddleIframe" src="http://www.aaa.com/kuayu/autoheight.html" width="0" height="0" style="display: none;" ></iframe>
<script type="text/javascript">
function on_Height(){
  hashH = document.documentElement.scrollHeight;
  urlC = "/kuayu/autoheight.htm";
  document.getElementById("MiddleIframe").src=urlC+"#"+hashH;
}
</script>

同域名下方法:

只需一步即可:

<iframe src="/abc/default.htm" id="iframepage" width="100%" height="100%" ></iframe>
<script type="text/javascript">
function iFrameHeight() {
  var ifm= document.getElementById("iframepage");
  var subWeb = document.frames ? document.frames["iframepage"].document : ifm.contentDocument;
  if(ifm != null && subWeb != null) {
    ifm.height = subWeb.body.scrollHeight;
  }
}
</script>

  

 

时间: 2024-12-10 20:34:54

跨域和非跨域 获取iframe页面高度的方法的相关文章

js获取iframe和父级之间元素,方法、属,获取iframe的高度自适应iframe高度

摘自:http://blog.csdn.net/kongjiea/article/details/38870399 1.在父页面 获取iframe子页面的元素 (在同域的情况下 且在http://下测试,且最好在iframe onload加载完毕后 dosomething...) js写法 a.同过contentWindow获取 也有用contentDocument 获取的 但是contentWindow 兼容各个浏览器,可取得子窗口的 window 对象.contentDocument Fir

iframe子页面获取父页面元素的方法

取得iframe中元素的方法有很多,在本文为大家介绍下在iframe子页面获取父页面元素的方法,下面有个不错的示例,感兴趣的朋友可以参考下 在iframe子页面获取父页面元素 代码如下: 复制代码代码如下: $.('#objld', parent.document); 在父页面获取iframe子页面的元素 代码如下: 复制代码代码如下: $("#objid", document.iframes('iframe').document) 或 复制代码代码如下: $(document.get

获取网页页面高度

<SCRIPT   LANGUAGE="JavaScript">  var s = "网页可见区域宽 :"+ document.body.clientWidth;  s += "\r\n网页可见区域高:"+ document.body.clientHeight;   s += "\r\n网页可见区域高:"+ document.body.offsetHeight +" (包括边线的宽)";  s

iframe自适应高度解决方法 .

<div id="leftBar"> <iframe name="tag" src="_iframe.html" style="width:100%; min-height:510px; border:0; overflow:hidden" onload="this.height=tag.document.body.scrollHeight"></iframe> <

php获取当前页面地址多种方法(附教程)

php获取当前页面地址多种方法 有关php取得当前页面地址的多种方法,包括收集的一些实例教程,记录下. 参考教程: PHP中获取当前页面的完整URL php获取当前页面地址参数的三种方法 php获取url地址栏与详细参数实例 php获取当前域名与url地址的例子 php获取当前URL地址 php取得当前页面完整url地址的例子 PHP代码: //获取域名或主机地址 echo $_SERVER['HTTP_HOST']."<br>"; #localhost //获取网页地址

Iframe 自适应高度的方法!

第一种方法:代码简单,兼容性还可以,大家可以先测试下. 1 function SetWinHeight(obj) 2 { 3 var win=obj; 4 if (document.getElementById) 5 { 6 if (win && !window.opera) 7 { 8 if (win.contentDocument && win.contentDocument.body.offsetHeight) 9 win.height = win.contentDo

JQuery iframe页面通过parent方法操作父页面中的元素与方法(实例讲解)

1)在iframe中查找父页面元素的方法: $('#id', window.parent.document) 2)在iframe中调用父页面中定义的方法和变量: parent.method parent.value 3)实例 1.父页面 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="If

Strut2 的 Action获取JSP 页面参数的方法

struts2 Action获取表单传值1.通过属性驱动式JSP:<form action="sys/login.action" method="post">      <input type="text" name="username">      <input type="submit" value="submit"></form> A

iframe自适应高度的方法

不带边框的iframe因为能和网页无缝的结合从而不刷新新页面的情况下实现更新页面部分的数据成为可能,可是iframe却不像层那样可以收缩自如,iframe高度需要动态的调整需要JS来配合使用,只能通过JS动态的来赋给他高度. function SetWinHeight(obj) { var win=obj; if (document.getElementById) { if (win && !window.opera) { if (win.contentDocument &&