为什么jqueryheight和javascript height返回0？

我在屏幕上有一个可见的div，但当我得到它的高度时，它总是返回0。这怎么可能？我尝试了许多jquery和javascript方法来获得High，但它返回0。这是我的部门：

<div class="option-content">
    <div class="row">
        <div class="col-sm-12">
            <div class="dropDownStyling" id="filterDropdowns">
            </div>

        </div>
    </div>

    <!-- Other contents -->
</div>

我还尝试了javascript：

 document.getElementById('filterDropdowns').offsetHeight
 document.getElementById('filterDropdowns').clientHeight

---

但在所有情况下，它都返回0，同时返回宽度值。那么为什么高度值为0呢？

在DOM就绪后创建一个函数和调用

    function test () {
    var height = $('#filterDropdowns').innerHeight();
alert(height)
 }


$(document).ready(function(){
$('#filterDropdowns').append('23');
test();
})

<div class="option-content">
    <div class="row">
        <div class="col-sm-12">
            <div class="dropDownStyling" id="filterDropdowns">

            </div>

        </div>
    </div>

//Other contents
</div>

功能测试（）{
变量高度=$（'#filterDropdowns'）。内部高度（）；
警戒（高度）
}
$（文档）.ready（函数（）{
$（'filterDropdowns'）。追加（'23'）；
test（）；
})
//其他内容

---

如果使用没有任何内容的空白DIV，则始终会得到0高度。

document.getElementById("xxx").clientHeight;

例如：

<div id="demo" class="text">
  <div id="abc">
  </div>
</div>

HTML

---

基于显示的html，元素是空的，除非有一些css赋予它高度，否则它为什么不为零？创建一个演示，复制您的问题，并使用足够多的css来表示会影响ITA的内容。我在您提供的上述信息中看到，我不清楚您是通过css显示元素的高度，还是元素包含内容。@charlietfl元素标记是用javascript DynamicCallyGain制作的，我们无法再现你的情况，我们知道的还不够。我们所知道的是，显示为零。如果有内容是异步添加的，你可能在加载html之前检查了高度。这太粗鲁了，为什么有人否决了这个答案。Lalji Tadhani只是想帮忙？clientHeight使用的是javascript，而不是jquery var height=document.getElementById（“filterDropdowns”）.clientHeight；注意（身高）另一种获得身高的方法不会改变任何事情我明白你在说什么，但是你太宽泛了，以至于你的答案不正确。空的

div

并不总是读取零高度。例如，如果一个样式表有一个定义，它给出的高度将反映该div是否为空。是的，如果您的div为空，但您使用CSS设置高度，那么它也将显示高度而不是我的下一票。顺便说一句，我想您的观点仍然大部分被理解了…所以不需要下一票。

document.getElementById("xxx").clientHeight;

<div class="option-content">
<div class="row">
    <div class="col-sm-12">
        <div class="dropDownStyling" id="filterDropdowns">

        </div>

    </div>
</div>

var height = $('#filterDropdowns').height();
alert(height)<br>

#filterDropdowns {
   height: 150px;
}