JQuery高度不会返回确切的高度

Question

我有一个问题，我不明白，谷歌搜索也没有太多的帮助，我想得到一个div的高度与p标签在多行中的图像

返回的高度就好像p标签只在一行中但在它已经渲染并跨越多行之后，当你调用函数高度它显示实际结果时，我该如何实际显示它我的javascript代码的实际高度？ 到目前为止我所拥有的是

console.log($('div.content-wrapper').height(), $('div.content-wrapper').outerHeight())

两者都显示相同的东西。

Height displayed: 42
Actual height: 86

P.S。我正在从JS <​​/ p>创建元素

$('div.container').append(' \
  <div class="content-wrapper"> \
    <p class="text"></p> \
    <div class="button"> \
      <span class="button-text"></span> \
    </div> \
  </div> \
');

Answer 1

$(element).outerHeight() 

将返回包含带边框和填充的高度的高度

使用，

$(element).outerHeight(true) 

也包括边距。

另外，如果你的包装DIV标签中有许多其他元素，那么你可以使用下面的代码。

$(window).load(function(){  
   $("wrapper-element").children().each(function(){
     totalHeight = totalHeight + $(this).outerHeight(true);
   });
});