Вычисление высоты дочерних элементов div с помощью jQuery
Я хочу сопоставить родительскую высоту с общей высотой своих "детей", поэтому содержимое не вытекает из родительской границы. Я использую следующий код:
$("#leftcolumn").each(function(){
totalHeight=totalHeight+$(this).height();
});
Будет ли он проходить через всех детей? Иногда это работает, иногда это не так.
Кроме того, я пробовал использовать следующий код, предполагая, что он рассмотрит все его дочерние элементы. Но результат странный и дает удвоенную высоту от правильного результата.
$("#leftcolumn > *").each(function(){
totalHeight=totalHeight+$(this).height();
});
Спасибо заранее.
Ответы
Ответ 1
Попробуй так:
var totalHeight = 0;
$("#leftcolumn").children().each(function(){
totalHeight = totalHeight + $(this).outerHeight(true);
});
http://api.jquery.com/outerHeight/ принимает margins
, paddings
и borders
в вычисление, которое должно возвращать более надежный результат.
Ответ 2
Другой подход - вычисление расстояния между верхними и нижними смещениями внутри элемента, , которые учитывали бы любые нестатические позиционированные элементы.
Я тестировал это только на одной странице и в среде, поэтому я не уверен, насколько безопасно это использовать. Пожалуйста, напишите комментарий, если это очень плохие коды или если он заслуживает некоторого улучшения.
var topOffset = bottomOffset = 0,
outer = true;
$el.children().each(function(i, e){
var $e = $(e),
eTopOffset = $e.offset().top,
eBottomOffset = eTopOffset + (outer ? $e.outerHeight() : $e.height());
if (eTopOffset < topOffset) {
topOffset = eTopOffset;
}
if (eBottomOffset > bottomOffset) {
bottomOffset = eBottomOffset;
}
});
var childrenHeight = bottomOffset - topOffset - $el.offset().top;
Ответ 3
Если вы хотите игнорировать скрытые элементы, вы можете отфильтровать их:
$("#leftcolumn").children().filter(':visible').each(function(){
totalHeight += $(this).outerHeight();
});
Ответ 4
$('#leftColumn').children().each(function(){
var Totalheight += $(this).Height();
})var parentHeight = $('#leftColumn').Height();
if(parentHeight===TotalHeight)
{//Do the nasty part}
else
{//Do the Good part}