找到兩個物體的高度差異並將高度分配給另一個物體

Question

找到兩個物體高度的差異並將高度分配給使用jquery或javascript的另一個物體。實際上對象（容器/部分）具有動態內容，因此這些對象在高度上是動態的。所以，我想查找兩個對象的差異，然後將這個差異分配給另一個對象。 例如 Div3（高度尺寸）= Div1（高度尺寸）-Div2（高度尺寸）。

Answer 1

假設divs的id爲div1,div2和div3。 然後使用JQuery .height()函數。

$("#div3").height($("#div1").height() - $("#div2").height()); 

您可以使用.height()或.innerHeight()或.outerHeight()。 （看到這裏的difference between the three）

var diff = $("#div1").height() - $("#div2").height(); 
 
$("#div3").height(diff); 
 
$("#div4").css("margin-top", diff);

#div1 { 
 
    height: 150px; 
 
    background-color: red; 
 
} 
 

 
#div2 { 
 
    height: 100px; 
 
    background-color: blue; 
 
} 
 

 
#div3 { 
 
    background-color: green; 
 
} 
 

 
#div4 { 
 
    height: 100px; 
 
    background-color: orange; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="div1"></div> 
 
<div id="div2"></div> 
 
<div id="div3"></div> 
 
<div id="div4"></div>