Usando una declaración if para verificar si un div está vacío

Estoy tratando de eliminar un div específico si un div separado está vacío. Esto es lo que estoy usando:

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

Creo que esto está cerca, pero no puedo entender cómo escribir el código para probar que #leftmenu está vacío. ¡Se agradece cualquier ayuda!

Puede utilizar .is().

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

O simplemente puede probar la lengthpropiedad para ver si se encontró una.

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

Tenga en cuenta que vacío significa que tampoco hay espacios en blanco. Si existe la posibilidad de que haya espacios en blanco, puede usar $.trim()y verificar la longitud del contenido.

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

Depende de lo que quieras decir con vacío.

Para verificar si no hay texto (esto permite elementos secundarios que están vacíos):

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

Para verificar si no hay elementos secundarios o texto:

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

O,

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

Si desea una demostración rápida de cómo verifica los divs vacíos, le sugiero que pruebe este enlace:

http://html-tuts.com/check-if-html-element-is-empty-or-has-children-tags/

A continuación tienes algunos ejemplos cortos:

Usando CSS

Si su div está vacío sin nada ni siquiera espacios en blanco, puede usar CSS:

.someDiv:empty {
    display: none;
}

Desafortunadamente, no hay un selector de CSS que seleccione el elemento hermano anterior. Solo hay para el siguiente elemento hermano:x ~ y

.someDiv:empty ~ .anotherDiv {
    display: none;
}

Usando jQuery

Comprobación de la longitud del texto del elemento con la función text ()

if ( $('#leftmenu').text().length == 0 ) {
    // length of text is 0
}

Compruebe si el elemento tiene etiquetas secundarias dentro

if ( $('#leftmenu').children().length == 0 ) {
    // div has no other tags inside it
}

Compruebe si hay elementos vacíos si tienen espacios en blanco

if ( $.trim( $('.someDiv').text() ).length == 0 ) {
    // white-space trimmed, div is empty
}

Puedes extender jQuery funcionalidad de esta manera:

Extender:

(function($){
    jQuery.fn.checkEmpty = function() {
       return !$.trim(this.html()).length;
    };
}(jQuery));

Utilizar :

<div id="selector"></div>

if($("#selector").checkEmpty()){
     console.log("Empty");
}else{
     console.log("Not Empty");
}

Prueba esto:

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

No es el más bonito, pero debería funcionar. Comprueba si innerHTML (el contenido de #leftmenu) es una cadena vacía (es decir, no hay nada dentro).

En mi caso, tenía varios elementos para ocultar en document.ready. Esta es la función (filtro) que me funcionó hasta ahora:

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

o .remove () en lugar de .hide (), lo que prefiera.

FYI: Esta, en particular, es la solución que estoy usando para ocultar las molestas celdas vacías de la tabla en SharePoint (además de esta condición "|| $ (this) .children (" menu "). Length".

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

Me encontré con esto hoy y las respuestas aceptadas no funcionaron para mí. Así es como lo hice.

if( $('#div-id *').length === 0 ) {
    // your code here...
}

Mi solución verifica si hay elementos dentro del div, por lo que aún marcaría el div vacío si solo hay texto dentro de él.

también puedes usar esto:

    if (! $('#leftmenu').children().length > 0 ) {
         // do something : e.x : remove a specific div
    }

¡Creo que funcionará para ti!

if($('#leftmenu').val() == "") {
   // statement
}