Question

HTML：

<div class="parent">
    <div class="one"></div>
    <div class="two"></div>
    <div class="three"></div>
</div>

的jQuery

parentWidth = $(".parent").outerWidth(true);
oneWidth = $(".parent .one").outerWidth(true);
twoWidth = $(".parent .two").outerWidth(true);
$('.parent .three').width( parentWidth - oneWidth - twoWidth);

但问题是，DIV .one或.two有时可能不存在，我该如何为它修改jQuery？

由于

Answer 1

您可以通过检查其长度属性来检查元素是否存在：

parentWidth = $(".parent").outerWidth(true);
oneWidth = $(".parent .one").length ? $(".parent .one").outerWidth(true):0;
twoWidth = $(".parent .two").length ? $(".parent .two").outerWidth(true):0;
$('.parent .three').width( parentWidth - oneWidth - twoWidth);

Answer 2

为什么不检查$ function的结果是否为空？ ;）这样你可以很容易地找出div是否存在，并在这种情况下简单地将宽度设置为0，例如。

oneDiv = $(".parent .one");
oneWidth = oneDiv.length == 0 ? 0 : oneDiv.outerWidth(true);

Answer 3

试试这段代码：

var third = $('.parent .three');
var wantedWidth = third.parent().outerWidth(true);

third.siblings().each(function(){
    wantedWidth -= $(this).outerWidth(true);
});

third.width(wantedWidth);

动态计算宽度（jQuery）

3 个答案: