Utilisation d'une instruction if pour vérifier si un div est vide

Question

J'essaie de supprimer une div spécifique si une div séparée est vide. Voici ce que j'utilise :

$(document).ready(function () {
    if ('#leftmenu:empty') {
        $('#menuTitleWrapper').remove();
        $('#middlemenu').css({ 'right': '0', 'position': 'absolute' });
        $('#PageContent').css({ 'top': '30px', 'position': 'relative' });
    }
});

Je pense que c'est proche mais je n'arrive pas à trouver comment écrire le code pour tester si #leftmenu est vide. Toute aide est appréciée !

Answer 1

Vous pouvez utiliser .is() .

if( $('#leftmenu').is(':empty') ) {
    // ...

Ou vous pouvez simplement tester le length pour voir s'il en existe un.

if( $('#leftmenu:empty').length ) {
    // ...

Gardez à l'esprit que vide signifie pas d'espace blanc non plus. S'il y a une chance qu'il y ait de l'espace blanc, alors vous pouvez utiliser $.trim() et vérifier la longueur du contenu.

if( !$.trim( $('#leftmenu').html() ).length ) {
    // ...

Answer 2

Cela dépend de ce que vous entendez par "vide".

Pour vérifier s'il n'y a pas de texte (cela permet aux éléments enfants qui sont eux-mêmes vides) :

if ($('#leftmenu').text() == '')

Pour vérifier s'il n'y a pas d'éléments enfants ou de texte :

if ($('#leftmenu').contents().length == 0)

Ou,

if ($('#leftmenu').html() == '')

Answer 3

Essayez ça :

$(document).ready(function() {
    if ($('#leftmenu').html() === "") {
        $('#menuTitleWrapper').remove();
        $('#middlemenu').css({'right' : '0', 'position' : 'absolute'});
        $('#PageContent').css({'top' : '30px', 'position' : 'relative'});
    }
});

Ce n'est pas le plus joli, mais ça devrait fonctionner. Elle vérifie si le innerHTML (le contenu de #leftmenu) est une chaîne vide (c'est-à-dire qu'il n'y a rien à l'intérieur).

Answer 4

Dans mon cas, j'avais plusieurs éléments à masquer sur document.ready. Voici la fonction (filtre) qui a fonctionné pour moi jusqu'à présent :

$('[name="_invisibleIfEmpty"]').filter(function () {
    return $.trim($(this).html()).length == 0;
}).hide();

ou .remove() plutôt que .hide(), selon votre préférence.

POUR INFO : C'est notamment la solution que j'utilise pour masquer les cellules de tableau vides gênantes dans SharePoint (en plus avec cette condition "|| $(this).children("menu").length".

Answer 5

if (typeof($('#container .prateleira')[0]) === 'undefined') {
    $('#ctl00_Conteudo_ctrPaginaSistemaAreaWrapper').css('display','none');
}