javascript - 如何根据另一个元素的随机生成的高度设置css元素的高度？

我试图在两个“墙”之间创建一个100px的一致间隙，一个在屏幕“ wallTop”的顶部，一个在底部“ wallBot”，就像《飞扬的小鸟》。我已经在'wallTop'上使用过Math.random来随机化其高度以随机化间隙的位置，但是如何将'wallBot'的高度设置为基于'wallTop'的随机化高度呢？

这是我尝试过的

var wallGap = 100;
var wallTop = document.getElementById("wallTop");
var constant= (wallTop.height+wallGap);

$("#wallTop").css("height",Math.round(Math.random()*150+70)+"px");
$("#wallBot").css("height",450-constant+"px");

“ 450”是整个容器的高度，因此我尝试在减去“ wallTop”和“ wallGap”（这将是“ wallBot”的高度）后找到余数。

最佳答案

为constant设置新的高度后，您的wallTop不会发生神奇的变化（还请注意，由于元素没有属性wallTop.height，因此undefined将为height）。

    var wallGap = 100;
    var wallSpace = 450 - wallGap;
    var wallTop = $("#wallTop");
    var wallBot = $("#wallBot");

    wallTop.height(Math.round(Math.random()*150+70));
    wallBot.height(wallSpace - wallTop.height());