脚下时光博客

常用、分享、学习

  • 博主:键盘上游荡
  • QQ:点击这里给我发消息
  • 微信:xia_bq
  • 业务:建站,二开,运维
AD
【腾讯云】云产品限时秒杀,爆款2核4G云服务器首年74元
文章目录

获取Iframe页面高度并赋值给Iframe以及获取iframe里的元素

xiabq 2023-12-13 00:27:16 点滴记忆 0

获取Iframe页面高度并赋值给Iframe

Html

<iframe name="container_ifranme" id="iframeId" scrolling="no" frameborder="no" border="0" src="home.html" onLoad="iFrameHeight()" ></iframe>

 

Js

 <script>
function iFrameHeight() {

         var ifm= document.getElementById("iframeId");

                   var subWeb = document.frames ? document.frames["iframeId"].document : ifm.contentDocument;

                   if(ifm != null && subWeb != null) {

                            ifm.style.height = 'auto';//关键这一句,先取消掉之前iframe设置的高度

                            ifm.style.height = subWeb.body.scrollHeight+'px';

                   }

         };
  </script>



 

获取iframe里的元素

1,contentWindow:是用来获取子窗口的window对象的,它兼容各大浏览器,用法如下

document.getElementById("iframeId").contentWindow

这样简单的一句就得到了iframe包含页面的window对象;

 

2,contentDocument:是用来获取子窗口的document对象的,主流浏览器都支持和ie8+支持,用法如下

document.getElementById("iframeId").contentDocument

这样简单的一句就得到了iframe包含页面的document对象;

 

以上两种方法是在父窗口中获取到子窗口,既然我们都能拿到子窗口window对象和document对象了,那么子窗口内其他的操作就easy了 !

如果要通过子窗口A访问到同级的子窗口B,那么我们可以在子窗口A中这么来做:

parent.getElementById("iframeId").contentWindow.document.getElmentById("frameId_B") 

或者parent.getElementById("iframeId").contentDocument.getElmentById("frameId_B")就得到B窗口了。


  • 分享: