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

Question

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 encontrar la manera de escribir el código para la prueba de #leftmenu está vacía. ¡Cualquier ayuda es apreciada!

Answer 1

Puede usar .is().

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

o usted podría probar la propiedad length para ver si se encontró uno.

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

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

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

Answer 2

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

Answer 3

Depende de lo que quiera decir con vacío.

para comprobar si no hay un texto (esto permite que los elementos secundarios que están vacíos a sí mismos):

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

para comprobar si no hay elementos secundarios o texto:

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

O

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

Answer 4

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

Answer 5

En mi caso Tenía varios elementos para ocultar en document.ready. Esta es la función (filtro) que trabajó para mí hasta ahora:

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

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

FYI: Esto, en particular, es la solución que estoy utilizando para ocultar celdas vacías molestos en SharePoint (además con este menú ") de longitud." Condición "(esto) .children (|| $".

Answer 6

Si desea una rápida demostración de cómo comprobar si hay elementos div vacíos le sugeriría probar este enlace:

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

---

A continuación tiene algunos ejemplos breves:

Usando CSS

Si su div es vacío sin nada, incluso sin espacios en blanco, se puede utilizar CSS:

.someDiv:empty { 
    display: none; 
} 

Desafortunadamente no hay ningún selector CSS que selecciona el elemento secundario anterior. No es sólo para el siguiente elemento hermano: x ~ y

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

Usando jQuery

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

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

Comprobar si el elemento tiene ningún niños Etiquetas interior

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

Comprobar si los elementos vacíos si tienen espacios en blanco

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

Answer 7

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

Answer 8

Puede extender jQuery funcionalidad de esta manera:

Extender:

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

Uso:

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

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