Javascript 使iframe高度适合内容

我如何使iframe的高度与其中的内容相适应？我假设您会计算内容高度和iframe高度之间的差异（我不知道如何做），并将其与while循环一起使用，以增加一个用作高度的变量，但我不知道如何实际执行这些操作。在询问之前：是的，框架中的内容来自我的网站。不跨域。

不太清楚为什么要使用iframe而不是动态div，比如说，通过ajax，但是：

将iframe中的内容放入div，然后获取div的高度。我建议使用jquery，如下所示：

$("#divId").height();

但是，如果您不能使用jquery，您应该能够使用：

document.getElementById("divId").offsetHeight;

然后，您需要将iframe的高度设置为您得到的任何值

jquery：

$("#iframeId").height($("#divId").height());

常规js：

document.getElementById("iframeId").style.height = 
document.getElementById("divId").offsetHeight;

---

一旦绘制了容器元素（“td1”），就可以在javascript中动态呈现iframe

<script type="text/javascript">
  var iframesrc = "@Href("~/about")";
  function init() {
  var vHeight = document.getElementById("td1").offsetHeight;
  document.getElementById("td1").innerHTML="<iframe style=\"width:100%; height:" + vHeight + "px\" src=\"" + iframesrc + "\"></iframe>";
  }
  window.onload = init; 
</script>

var iframesrc=“@Href”（~/about”）；
函数init（）{
var vHight=document.getElementById（“td1”）.offsetHeight；
document.getElementById（“td1”）.innerHTML=“”；
}
window.onload=init；

---

下面是一个使用jQuery的解决方案：

$('#iframe').height($('#iframe').contents().find('body').height());

---

有人还在使用框架吗？@yoda他指的是iframe，它们只被websphere中微不足道的公司使用，比如谷歌和Facebook。框架内容在你的网站上？可能与你看过的GitHub项目重复？这是行不通的。您不能从iframe外部访问iframe div。但是，您可以这样做：

document.getElementById（“frameId”）.contentWindow.document.getElementById（“id”）

@JCOC611

document.getElementById（“frameId”）.contentWindow.document

在我看来，这些天也禁止访问（至少在FF中）@YakovL看起来在Chrome 56.0中运行良好。请确保主文档和iframe位于同一个域。@JCOC611很抱歉，您错过了问题中的“非跨域”部分，或者在认为它仅跨域不起作用之前进行了评论。不过，有一个答案值得注意：当我写这篇文章时，我是一个mootools人。

<script type="text/javascript">
  var iframesrc = "@Href("~/about")";
  function init() {
  var vHeight = document.getElementById("td1").offsetHeight;
  document.getElementById("td1").innerHTML="<iframe style=\"width:100%; height:" + vHeight + "px\" src=\"" + iframesrc + "\"></iframe>";
  }
  window.onload = init; 
</script>

<td id="td1" style="width: 100%; height:100%;">                 
</td>

$('#iframe').height($('#iframe').contents().find('body').height());