如何測量沒有高度的div的高度

我需要得到div的高度。我不能在CSS中設置高度，因爲內容可能會改變（取決於內容）。我想：如何測量沒有高度的div的高度

var buttonsHeight = $(".buttonsContainer").height();

和

var buttonsHeight = $(".buttonsContainer").outerHeight();

和

var buttonsHeight = $(".buttonsContainer").innerHeight();

在任何情況下buttonsHeight是null。

CSS：

.buttonsContainer{ 
    padding:31px 16px 0; 
    position:fixed; 
}

小提琴： http://jsfiddle.net/U7Kck/3/

如果更換填充：20px的0;具有高度：40像素，然後buttonsContainer看起來很好...

來源

2013-09-30 Mag

這是不可能的標識與你給的信息，問題的根源。你可以用[jsfiddle]（http://www.jsfiddle.net）重新創建它嗎？ – George

你確定jQuery正在選擇一個現有的元素？嘗試和'console.log（$（「。buttonsContainer」）.length）;' –

如果'buttonsHeight'爲'null'，那麼當你運行你的查詢時元素不存在 – CodingIntrigue

var buttonsHeight = $(".buttonsContainer")[0].clientHeight

來源

2013-09-30 12:08:55 Sarim

它返回錯誤：「TypeError：$（...）[0]是不確定的」 – Mag

@Mag你確定'$（'。 buttonsContainer'）'與某些元素相匹配？ –

是的:) \t 小提琴創建：jsfiddle.net/U7Kck/3 – Mag

我當網頁打開它被賦予高度到div，我現在不能測試想，但我想你可以得到它：

$(".buttonsContainer").css("height")

來源

2013-09-30 12:12:24 CarinaPilar

它將返回高度作爲字符串與單位包括像「123px」。 –

試試這個：

var elem = $('.buttonsContainer')[0]; 
buttonsHeight = window.getComputedStyle(elem, null).getPropertyValue('height');

爲getComputedStyle文檔可here

來源

2013-09-30 12:14:31

這些jQuery方法工作正常。實施例：

$(document).ready(function() { 
    var buttonsHeight = $(".buttonsContainer").height(); 
    console.log("height: " + buttonsHeight); 
    buttonsHeight = $(".buttonsContainer").innerHeight(); 
    console.log("inner height: " + buttonsHeight); 
    buttonsHeight = $(".buttonsContainer").outerHeight(); 
    console.log("outer height: " + buttonsHeight); 
});

用簡單的HTML等：

<div class="buttonsContainer">Some <br/>content</div> 
<div class="buttonsContainer">Some content</div>

即使使用多個buttonsContainer元件正常工作。只返回找到的第一個元素的高度。

http://jsfiddle.net/KBR3r/2/

所以我想這個問題是其他地方。

來源

2013-09-30 12:18:03

clientHeight和offsetHeight爲你工作。在這裏檢查他們正在工作。根據您的要求使用上述任何一項，即是否將邊框視爲寬度。 http://jsfiddle.net/KzTDS/。要獲得offsetHeight和clientHeight檢查這個difference between offsetHeight and clientHeight

的更多想法，在這裏是如何使用

document.getElementById('button').clientHeight; // Same as below but does not include border scrollbar and no margin 
document.getElementById('button').offsetHeight; // content, padding, border, scrollbar and no margin

來源

2013-09-30 12:19:09 Exception

如何測量沒有高度的div的高度

回答

相關問題