使用javascript从另一个div高度设置div高度

Question

我有两个div并排.它们都没有标准高度,但是第一个具有内容,而另一个在表单子项后填充内容.我想将第二个的高度设置为与第一个相同.

这是html:

<div id='left'>
...........
</div>
<div id='right'>
...........
</div>

<script type="text/javascript">
    $(document).ready ( function(){

    var divHeight = document.getElementById('left').style.height;
    document.getElementById('right').style.height = divHeight+'px';
    });?
</script>

我在控制台上没有任何错误,但第二个div的高度不会改变.有帮助吗？

Answer 1

你正在寻找offsetHeight.height最左边div 的属性未设置(因为这是实际的CSS属性,并且您没有静态设置高度),但是offsetHeightdiv的实际高度由其内容定义.

var offsetHeight = document.getElementById('left').offsetHeight;
document.getElementById('right').style.height = offsetHeight+'px';

这是一个jsFiddle来演示.

请注意,还有clientHeight.区别在于offsetHeight还包括填充和边框.也请参阅此答案.