Question

假设我有一个父div和三个子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

首先通过$（＆＃39;＃parent＆＃39;）。身高和孩子使用$（＆＃39;＃child1＆＃39;）。height（）获取父亲的身高，并应用简单的数学规则和获取变量中的高度。

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

然后使用jquery

的.height（）属性将该变量存储在child3中

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

Answer 2

尝试：

$('#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

＆＃13;

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

＆＃13;

<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-->

＆＃13;

如何使用jQuery计算和设置元素的高度？

4 个答案: