Question

<iframe id="frame1" name="frame1" width="200" height="600" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://localhost/Widget/"></iframe>

我想使用JavaScript从页面http://localhost/Widget/中找到此iframe的高度。

有没有办法这样做？提前谢谢。

Answer 1

我在自己的解决方案中对问题采取了不同的方式：在iframe中我有：

<body onload="parent.setsize(document.body.scrollHeight);">

在父母中我有一个js函数：

function setsize(pixels){ 
if(navigator.appName=="Microsoft Internet Explorer") pixels+=40;
if (navigator.userAgent.indexOf("Firefox")!=-1) pixels+=40;
document.getElementById('produktet').style.height=pixels+"px";

如您所见，iframe内容的总高度为：document.body.scrollHeight

Answer 2

你必须首先让“父母”这样做。您可以通过document.parent获取父级，因此以下内容应该有效（未经过测试）：

parent.getElementById( 'frame1' ).getAttribute( 'height' );

如果您已在父级中加载jQuery，则可以使用：

parent.jQuery('#frame1').attr('height');

编辑：请注意，此处存在安全限制：两个页面都必须位于同一个域中才能生效。

Answer 3

绕过跨源问题。您可以在身体加载前读取高度：

<html>
  <head>
    <script>
        var iframeSize = Math.max( document.documentElement.clientHeight,
                                   document.documentElement.scrollHeight,
                                   document.documentElement.offsetHeight );
    </script> 
  </head>
<body>
  ...

Answer 4

$('#frame1').attr('height');

使用jQuery。或

document.getElementbyId('frame1').getAttribute('height');

使用普通的js。

如何从源头获取iframe的高度

4 个答案: