[javascript] Come posso verificare se un elemento HTML è vuoto usando jQuery?



Answers

Ho scoperto che questo è l'unico modo affidabile (poiché Chrome e FF considerano gli spazi e gli interruzioni di riga come elementi):

if($.trim($("selector").html())=='')
Question

Sto provando a chiamare una funzione solo se un elemento HTML è vuoto, usando jQuery.

Qualcosa come questo:

if (isEmpty($('#element'))) {
    // do something
}



!elt.hasChildNodes()

Sì, lo so, non è jQuery, quindi puoi usare questo:

!$(elt)[0].hasChildNodes()

Felice adesso?




Prova questo:

if (!$('#el').html()) {
    ...
}



Ecco un filtro jQuery basato su https://.com/a/6813294/698289

$.extend($.expr[':'], {
  trimmedEmpty: function(el) {
    return !$.trim($(el).html());
  }
});



document.getElementById("id").innerHTML == "" || null

o

$("element").html() == "" || null



Le interruzioni di riga sono considerate come il contenuto di elementi in FF.

<div>
</div>
<div></div>

Ex:

$("div:empty").text("Empty").css('background', '#ff0000');

In IE entrambi i div sono considerati vuoti, in FF e Chrome solo l'ultimo è vuoto.

È possibile utilizzare la soluzione fornita da @qwertymk

if(!/[\S]/.test($('#element').html())) { // for one element
    alert('empty');
}

o

$('.elements').each(function(){  // for many elements
    if(!/[\S]/.test($(this).html())) { 
        // is empty
    }
})



Un'altra opzione che dovrebbe richiedere meno "lavoro" per il browser rispetto a html() o children() :

function isEmpty( el ){
  return !el.has('*').length;
}



Se per "vuoto", intendi senza contenuto HTML,

if($('#element').html() == "") {
  //call function
}



Links