Как вычислить и установить высоту для элемента с помощью jQuery?

Question

Скажем, у меня есть один родительский DIV и три дочерних дивы как это

<div id="parent"> 
    <div id="child1">...</div> 
    <div id="child2">...</div> 
    <div id="child3">...</div> 
</div> 

Я хочу, чтобы рассчитать и установить высоту child3 на основе этой псевдо формуле

child3height = parentheight - child1height + child2height

Как я могу написать это в jQuery и установить его таким образом?

Answer 1

первым получить высоту родителя по $ ('# родительскую') высотой и Чайлдс с $ ('# child1') высота() и применить простой mathamatics правила и получить высоту в переменной.

var child3Height = $('#parent').height - ($('#child1').height() + $('#child2').height()); 

, а затем хранить эту переменную в child3 с .height() свойство JQuery

$('#child3').height(child3Height); 

Answer 2

Try:..

$('#child3').height($('#parent').height()-$('#child1').height()+$('#child2').height()) 

Answer 3

var parentheight = $("#parent").height(); 
var child1height = $("#child1").height(); 
var child2height = $("#child2").height(); 

$("#child3").height(parentheight - child1height + child2height); 

Answer 4

var child3Height = $('#parent').height() - $('#child1').height() + $('#child2').height(); 
 
$('#child3').height(child3Height); 
 
$('span').html('Child3 height is ' + child3Height); //this line only for demo purpose

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div id="parent"> 
 
    <div id="child1">...</div> 
 
    <div id="child2">...</div> 
 
    <div id="child3">...</div> 
 
</div> 
 

 
<span></span> <!--demo purpose only-->