javascript - 如何在html完成渲染后获取一个div的高度并将其分配给另一个div

Question

<div class="col-xs-10" id="leftDoc" "> ... </div>
  <uib-tabset type="tabs">
      <uib-tab heading="Event 1 Information"> ....
      <uib-tab heading="Event 2 Information"> ....
      <uib-tab heading="Event 3 Information"> ....
      <uib-tab heading="Event 3 Information"> ....
  </uib-tabset>
<div class="col-xs-10" id="leftDoc" > ... </div>

基本上我有 Angular 应用程序，我只想从“leftDoc”获取高度并将其分配给“rightDoc”。似乎有关于这个主题的讨论，但它与 Controller 完成加载数据有关，但在我的情况下，我没有任何数据可以加载，但是当我使用这个脚本时，它计算出错误的高度

<script>
   $(document).ready(function() {
      var height = Math.max($("#leftDoc").height(), $("#rightDoc").height());
      $("#leftDoc").height(height);
      $("#rightDoc").height(height);
   });
</script>

Answer 1

$( document ).ready( function() {
    var leftHeight = $( "#leftDoc" ).height();

    $( "#rightDoc" ).height( leftHeight );
} );

或者

$( document ).ready( function() {
    var leftHeight = $( "#leftDoc" ).height();

    $( "#rightDoc" ).css( "height", leftHeight );
} );

编辑:

您还可以使用 .outerHeight()包括 div 的顶部和底部填充:

var leftHeight = $( "#leftDoc").outerHeight();