Question

计算元素的高度总和并应用为＆＃34; min-height＆＃34; on .body div我正在使用：

$(window).on("resize", function () {
  var a = $("body").outerHeight();
  var b = $(".header").outerHeight(true);
  var c = $(".footer").outerHeight(true);
  var d = $(".bottom").outerHeight(true);
  $(".body").css("min-height", a - b - c - d);
}).trigger("resize");

如果html上存在所有元素，它可以正常工作，但是如果一个元素缺少它就会被破坏。

好 - https://jsfiddle.net/0ggr3ptv/1/

错误 - https://jsfiddle.net/oed11Lzm/1/ .bottom div缺失。

如何排除缺失的元素或让它们为0？

使用jQuery 3.1.1和.bottom div变得未定义。我该如何解决？感谢

Answer 1

使用

    == MENU ==============================================
    ===========================
    | LEFT VIEW |  TOP VIEW   |
    |           |             |
    |           |             |
    |           |=============|
    |           | BOTTOM VIEW |
    |           |             |
    ===========================
    ======================= BANNER =======================


                          [COMPOSITE]


    ======================= BANNER =======================
    ======================================================

而不是

var d = $(".bottom").outerHeight(true) || 0;

将默认值设置为0.可以找到更多信息here。

Answer 2

您可以使用isNAN()检查数字是否为数字 d = isNaN(d) ? 0 : d;

请参阅更新的小提琴：https://jsfiddle.net/oed11Lzm/2/

Jquery - 计算元素的高度总和

2 个答案: