Css 获取显示中元素的高度：无iframe

我尝试获取iframe中元素的高度，iframe位于display:none的div中。我需要的是iframe中文档的高度，而不是外部。因此，您不必考虑安全约束

编辑：这里有一个小提琴来演示这个问题：。控制台将记录0。我无法将divmyelement或其副本附加到某些可见元素上，以便渲染它，并获得如下解决方案中所示的高度

我找到了一些解决方案，如：

var copied_elem = $("#myelement").clone()
                      .attr("id", false)
                      .css({visibility:"hidden", display:"block", 
                               position:"absolute"});
    $("body").append(copied_elem);
    var height = copied_elem.height();
    var width = copied_elem.width();
    copied_elem.remove();

如果元素本身为display:none，则该选项将起作用。但是我在iframe中根本没有任何显示的元素，所以我不能将它附加到显示的元素

---

你知道如何获得高度吗？

既然你似乎在IFRAME和你的内容之间建立了一个交互，那么把它应用到IFRAME本身应该不难：

position: absolute;
display: block;
top: -999999;
left: -999999;

---

然后，您应该能够在IFRAME中获得元素的尺寸，一旦获得了尺寸，就可以通过重置这些样式将IFRAME返回到其原始位置。

因为我没有足够的声誉来提交。所以我在这里说。 改变iframe的位置是个好主意，是的

图像是我的代码，它是一个标签

<div class="table census-table">
   <div class="census-table-list">
       <iframe src="census-baseData-iframe.php" frameborder="0" scrolling="no" width="950" 1height="590" style=""></iframe>
       <iframe src="census-activeUser-iframe.php" frameborder="0" scrolling="no" width="950"  1height="590" style="display: none;"></iframe>
       <iframe src="census-userKeep-iframe.php" frameborder="0" scrolling="no" width="950" 1height="590" style="display: none;"></iframe>
       iframe src="census-userPay-iframe.php" frameborder="0" scrolling="no" width="950" 1height="590" style="display: none;"></iframe>
   </div>
</div>

---

据我所知，由于安全限制，您不能使用JavaScript与iframe交互？@ZathrusWriter如果iframe来自同一个域，您可以。在我的例子中，它来自另一个域，但我已经处理了它们之间的通信。我需要的是iframe中文档的高度，而不是外部。这可能会导致页面重新布局，因此请将iframe包装在静态容器中以避免布局的更改。显示的不是iframe本身：无，而是它的父级。但是，如果没有其他解决方案，我会将其应用于显示的元素，然后重新调整高度，然后将iframe设置回原来的位置@guymid:所以我会使用a作为容器？为了保持稳定的布局，需要将包装元素设置为与移动的子元素相同的大小。这样，浏览器就不需要重新计算，并且可以防止任何闪烁。仅当元素未绝对定位时才需要此操作。