Verwenden einer if-Anweisung, um zu überprüfen, ob ein div leer ist

Ich versuche, ein bestimmtes Div zu entfernen, wenn ein separates Div leer ist. Folgendes verwende ich:

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

Ich denke, das ist nah, aber ich kann nicht herausfinden, wie man den Code zum Testen von #leftmenu schreibt, ist leer. Jede Hilfe wird geschätzt!

Sie können verwenden .is().

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

Oder Sie können die lengthEigenschaft einfach testen , um festzustellen, ob eine gefunden wurde.

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

Denken Sie daran, dass leer auch kein Leerraum bedeutet. Wenn die Möglichkeit besteht, dass Leerzeichen vorhanden sind, können Sie $.trim()die Länge des Inhalts verwenden und überprüfen.

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

Es kommt darauf an, was du mit leer meinst.

So überprüfen Sie, ob kein Text vorhanden ist (dies ermöglicht untergeordnete Elemente, die selbst leer sind):

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

So überprüfen Sie, ob keine untergeordneten Elemente oder Texte vorhanden sind:

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

Oder,

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

Wenn Sie eine kurze Demo wünschen, wie Sie nach leeren Divs suchen, empfehlen wir Ihnen, diesen Link auszuprobieren:

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

Nachfolgend finden Sie einige kurze Beispiele:

Verwenden von CSS

Wenn Ihr div ohne Leerzeichen leer ist, können Sie CSS verwenden:

.someDiv:empty {
    display: none;
}

Leider gibt es keinen CSS-Selektor, der das vorherige Geschwisterelement auswählt. Es gibt nur für das nächste Geschwisterelement:x ~ y

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

Verwenden von jQuery

Überprüfen der Textlänge des Elements mit der Funktion text ()

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

Überprüfen Sie, ob das Element untergeordnete Tags enthält

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

Suchen Sie nach leeren Elementen, wenn sie Leerzeichen haben

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

Sie können die jQuery- Funktionalität folgendermaßen erweitern:

Erweitern :

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

Verwenden :

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

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

Versuche dies:

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

Es ist nicht das Schönste, aber es sollte funktionieren. Es wird geprüft, ob innerHTML (der Inhalt von #leftmenu) eine leere Zeichenfolge ist (dh nichts darin enthalten ist).

In meinem Fall musste ich mehrere Elemente in document.ready ausblenden. Dies ist die Funktion (Filter), die bisher für mich funktioniert hat:

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

oder .remove () statt .hide (), was auch immer Sie bevorzugen.

Zu Ihrer Information: Dies ist insbesondere die Lösung, mit der ich störende leere Tabellenzellen in SharePoint verstecke (zusätzlich zu dieser Bedingung "|| $ (this) .children (" menu "). Length".

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

Ich bin heute darauf gestoßen und die akzeptierten Antworten haben bei mir nicht funktioniert. Hier ist, wie ich es gemacht habe.

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

Meine Lösung prüft, ob sich Elemente im div befinden, sodass das div weiterhin als leer markiert wird, wenn nur Text darin enthalten ist.

auch können Sie dies verwenden:

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

Ich denke, es wird für dich funktionieren!

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