获得计算高度 - Javascript - 不是jQuery

时间:2013-11-22 19:30:58

标签: javascript height

我有两个div并排设置为高度auto。我希望它们具有相同的高度,所以我将它们组合成一个数组的成员。

我通过阵列递归并将最高的那些设置为最高的高度。问题是我试图让COMPUTED高度导致错误值的一切。

我尝试了以下内容:

(els[x].currentStyle) ? h=els[x].currentStyle.height : h=window.getComputedStyle(els[x],null).height;

h =  el.clientHeight || el.offsetHeight || el.scrollHeight;

这两个都产生640 px'ish,而在我的特定显示中计算结果为751.8。

我是否可以使用常数来获得正确的高度。就像我可以得到的数字是标准尺寸的屏幕(如960像素高或者这样),然后是窗口尺寸的多倍?

2 个答案:

答案 0 :(得分:6)

我已经很好地利用了我提出的这个小功能

function getH(id)
{
    return document.getElementById(id).offsetHeight;
}
// I have a styles.js file where this function feels right at home. Access this function from anywhere.

这将返回给予函数的任何给定元素的高度(通过它的ID)。所以现在我们已经完成了1/3。

然后使用Math.max()函数获取最大元素的高度。

var maxH = Math.max(getH("ID1"),getH("ID2")); 

这是2/3,YAY - 现在将元素高度设置为相同。

var x = document.getElementById("ID1");
var y = document.getElementById("ID2");

x.style.height = maxH +"px";
y.style.height = maxH +"px";  //Remember the +"px" has to be added as a string, thats the reason for the "".

DONE !! - 现在把它们放在一起

我会想象这样的事情

function setElementHeight()
{
    var maxH = Math.max(getH("ID1"),getH("ID2"));
    var x = document.getElementById("ID1");
    var y = doc...("ID2");
    x.style.height = maxH +"px";
    y.style.height = maxH +"px";
}
// Don't forget to include the first function in you'r .js file

这将把两个ID设置为相同的高度,高度将等于最高。这就是你想要的,不是吗?

- 编辑 -

如果我是你,我会扔掉阵列。只需拥有2个DIV,每个DIV都有一个唯一的ID,并根据它们使它们同样高。

  • 莫尔

答案 1 :(得分:4)

如果您拥有DOM文档,则可以尝试以下代码:

[JS Fiddle][2]
一旦计算出

'height',它的精确高度将与'divId'相同。