如何获得动态大小的div的新大小？

Question

我有一个div，当一个按钮被点击时，它会从页面的底部滑上来。我使用css转换并更改div的css "top“属性来完成此操作。如果div大小从不改变，则可以正常工作。例如，如果div是400px高，我只需将它向上移动400px，它现在就在适当的位置。凉爽的。

但是..。如果div有动态生成的内容，并且每次都有不同的高度怎么办？我如何才能计算出要将div上移多少才能100%显示？

所以在伪代码中，我想要类似这样的东西

function movemydiv() {

var howMuchToMoveIt = ??? (somehow getting the dynamic containers height)

document.getelementbyId("mydiv").style.top = bottomOfScreen - howMuchToMoveIt

有什么最简单的方法可以做到这一点？

Answer 1

您可以使用clientHeight或offsetHeight来测量div的高度。clientHeight和offSetHeight都包括填充，但offsetHeight还将考虑边框和水平滚动条(如果呈现)-请参阅MDN链接。

所以你的js应该是这样的：

var howMuchToMoveIt = document.getElementById('mydiv').clientHeight;

然后，var将包含元素的高度。

希望这能有所帮助