Question

我有两个div，两个都没有在css中设置高度，因为我想采取它们最终的任何高度，并将另一个div设置为该高度。

我的javascript就是这个

function fixHeight() {
    var divh = document.getElementById('prCol1').height;
    document.getElementById('prCol1').innerHTML = '<ul><li>' + divh + '</li></ul>';
    document.getElementById('prCol2').style.height = divh + 'px';
}

我有以下代码行，只是为了看看我是否得到某种实际的回复。

document.getElementById('prCol1').innerHTML = '<ul><li>' + divh + '</li></ul>';

我有一个onload设置来运行函数

我的两个div看起来像这样

<div id="prCol1">
     ..content..
</div>
<div id="prCol2" class="slideshow">
    ..content..
</div>

Answer 1

使用offsetHeight - http://jsfiddle.net/HwATE/

function fixHeight() {
    var divh = document.getElementById('prCol1').offsetHeight; /* change this */
    document.getElementById('prCol1').innerHTML = '<ul><li>' + divh + '</li></ul>';
    document.getElementById('prCol2').style.height = divh + 'px';
}

Answer 2

您可以使用jQuery获取高度并进行设置。

var h = $("#prCol1").height();
$("#prCol2").height(h);

Answer 3

有一些jQuery插件可以通用的方式执行此操作。 Here's one

Answer 4

我建议在这里使用jQuery。您不能像我在任何我知道的浏览器中那样获得元素的高度。如果您使用非常简单的jQuery，这是代码。如果没有jQuery，我不会尝试这样做，因为浏览器在访问高度方面可能有所不同。

function fixHeight() {
    var $prCol1 = $('#prCol1');
    var divh = $prCol1.height();
    $prCol1.html('<ul><li>' + divh + '</li></ul>');
    $('#prCol1').height(divh);
}

Answer 5

您可以通过以下代码获取身高：

document.getElementById('YourElementID').clientHeight;

获取div的高度并使用它设置另一个div的高度

5 个答案: