Javascript 获取要复制的子元素的总高度

我有一个固定位置的

#标题

，其中X为

。child

元素，高度为19px，隐藏溢出。

#标题

有一个

：悬停

，它将高度更改为

最大高度

（因此它会随着其中的.child元素展开），并带有动画

转换：最大高度0.2s 1s。（固定div不能在其增长或收缩时左右操纵div），因此我想在
#header
下创建一个
位置：relative
div，该div的内容高度与
#header
相同，与
#header:hover
同时增长或收缩，但可以通过动画移动其下的其他div

我在Stackoverflow上的其他帖子上找到了一种方法，除了它将.child元素的所有高度都计算在一起之外，几乎成功了。我只需要
#父项的高度
，但这是
最大高度
而不是固定高度

[更新]由于@joel almeida解决了问题
因为div有一个短的高度和隐藏的溢出，它无法读取div的高度，但是添加了。scrollHeight它可以读取div的高度，无论它是否可见隐藏。当您可以直接获得父级高度时，为什么要计算所有子级高度

试试这个：


$（函数（）{
var totalHeight=0；
totalHeight=$（“#父项”）[0]。滚动高度；
警报（“所有分区的总高度：+总高度”）；
$（“.clonechild”）。高度（总高度）；
});
#父级{
浮动：左；
宽度：500px；
背景色：#E0；
}
#父母，孩子{
浮动：左；
高度：100px；
宽度：100px；
背景色：#666；
框大小：边框框；
-moz框大小：边框框；
-webkit框大小：边框框；
边框：1px纯黑；
}
#parent.child、.clonechild p{
字体大小：14px；
颜色：#fff；
文本对齐：居中；
}
#cloneparent{
位置：绝对位置；
利润率：300px自动0px；
宽度：510px；
背景色：#E0；
}
#克隆人{
浮动：左；
最小高度：100px；
身高：；
宽度：100px；
背景色：#666；
框大小：边框框；
-moz框大小：边框框；
-webkit框大小：边框框；
边框：1px纯黑；
}

一,

二,

三,

四,

五,

六,

七,

八,

__#家长显然不是800px的高度

这需要与#父项的高度相同

__#cloneparent的身高显然不同于#父代

既然可以直接得到父身高，为什么还要计算所有子身高

试试这个：


$（函数（）{
var totalHeight=0；
totalHeight=$（“#父项”）[0]。滚动高度；
警报（“所有分区的总高度：+总高度”）；
$（“.clonechild”）。高度（总高度）；
});
#父级{
浮动：左；
宽度：500px；
背景色：#E0；
}
#父母，孩子{
浮动：左；
高度：100px；
宽度：100px；
背景色：#666；
框大小：边框框；
-moz框大小：边框框；
-webkit框大小：边框框；
边框：1px纯黑；
}
#parent.child、.clonechild p{
字体大小：14px；
颜色：#fff；
文本对齐：居中；
}
#cloneparent{
位置：绝对位置；
利润率：300px自动0px；
宽度：510px；
背景色：#E0；
}
#克隆人{
浮动：左；
最小高度：100px；
身高：；
宽度：100px；
背景色：#666；
框大小：边框框；
-moz框大小：边框框；
-webkit框大小：边框框；
边框：1px纯黑；
}

一,

二,

三,

四,

五,

六,

七,

八,

__#家长显然不是800px的高度

这需要与#父项的高度相同

__#cloneparent的身高显然不同于#父代

你能吐出一个JSFIDLE吗example@seth-mcclaine这里有一个JSFIDLE的Stackoverflow示例，但我认为它已经解决了，感谢您的参与！你能吐出一杯威士忌吗example@seth-mcclaine这里有一个JSFIDLE的Stackoverflow示例，但我认为它已经解决了，感谢您的参与！我想这就是诀窍！我假设你需要设置一个高度来读取它，但显然它可以计算元素的高度，而不需要设置数字。谢谢你的调查@807
outerHeight（）
获取计算的高度，因此不管您是否设置了它，浏览器呈现的是什么：）经过一些修改后，我让它工作起来，这有点困难，因为它有一个隐藏的溢出。我使用“.scrollHeight属性”将代码更改为：'totalHeight=$（'#parent'）[0].scrollHeight；'而不是。户外灯光。我想这就行了！我假设你需要设置一个高度来读取它，但显然它可以计算元素的高度，而不需要设置数字。谢谢你的调查@807
outerHeight（）
获取计算的高度，因此不管您是否设置了它，浏览器呈现的是什么：）经过一些修改后，我让它工作起来，这有点困难，因为它有一个隐藏的溢出。我使用“.scrollHeight属性”将代码更改为：'totalHeight=$（'#parent'）[0].scrollHeight；'而不是。户外灯光。