largeur Calculer dynamiquement (jQuery)

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

Mais la chose est, que ce soit DIV .one ou .TWO peuvent ne pas exister quelques fois, comment puis-je modifier le jQuery pour ça?

Merci

Answer 1

Vous pouvez vérifier si un élément existe en vérifiant sa propriété longueur:

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

Pourquoi ne pas vérifier que si le résultat de la fonction $ est vide? ;) De cette façon, vous pouvez facilement savoir si la div existe et simplement définir la largeur à 0 dans ce cas, par ex.

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

Answer 3

Essayez ce code:

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

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

third.width(wantedWidth);