JQuery kullanarak bir HTML öğesinin boş olup olmadığını nasıl kontrol edebilirim?

JQuery kullanarak bir HTML öğesi boşsa, yalnızca bir işlevi çağırmaya çalışıyorum.

Bunun gibi bir şey:

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

if ($('#element').is(':empty')){
  //do something
}

daha fazla bilgi için bkz. http://api.jquery.com/is/ ve http://api.jquery.com/empty-selector/

DÜZENLE:

Bazılarının işaret ettiği gibi, boş bir öğenin tarayıcı yorumu değişebilir. Boşluklar ve satır kesmeleri gibi görünmez öğeleri yok saymak ve uygulamayı daha tutarlı hale getirmek istiyorsanız bir işlev oluşturabilirsiniz (veya yalnızca içindeki kodu kullanabilirsiniz).

  function isEmpty( el ){
      return !$.trim(el.html())
  }
  if (isEmpty($('#element'))) {
      // do something
  }

Bunu bir jQuery eklentisine de yapabilirsiniz, ancak fikri anlarsınız.

Bunu tek güvenilir yol olarak buldum (Chrome ve FF, boşlukları ve satır satırlarını öğeler olarak kabul ettiğinden):

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

Boşluk ve satır sonları kullanımdaki ana sorunlardır: boş seçici. Dikkatli olun, CSS'de: boş sözde sınıf aynı şekilde davranır. Bu yöntemi seviyorum:

if ($someElement.children().length == 0){
     someAction();
}

!elt.hasChildNodes()

Evet, biliyorum, bu jQuery değil, bu yüzden bunu kullanabilirsiniz:

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

Şimdi mutlu?

jQuery.fn.doSomething = function() {
   //return something with 'this'
};

$('selector:empty').doSomething();

"Boş" ile ifade ediyorsanız, HTML içeriği olmadan,

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

İçinde olduğu gibi boş metin içermiyor mu?

if (!$('#element').text().length) {
    ...
}

Özgeçmişte, bir öğenin boş olup olmadığını öğrenmek için birçok seçenek vardır:

1- Kullanma html:

if (!$.trim($('p#element').html())) {
    // paragraph with id="element" is empty, your code goes here
}

2- Kullanma text:

if (!$.trim($('p#element').text())) {
    // paragraph with id="element" is empty, your code goes here
}

3- Kullanma is(':empty'):

if ($('p#element').is(':empty')) {
    // paragraph with id="element" is empty, your code goes here
}

4- Kullanma length

if (!$('p#element').length){
    // paragraph with id="element" is empty, your code goes here
}

Bağımlı olarak, bir giriş öğesinin boş olup olmadığını bulmaya çalışıyorsanız şunları kullanabilirsiniz val:

if (!$.trim($('input#element').val())) {
    // input with id="element" is empty, your code goes here
}

Tarayıcı için html()veya daha az "iş" gerektiren başka bir seçenek children():

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

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

veya

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

Deneyebilirsin:

if($('selector').html().toString().replace(/ /g,'') == "") {
//code here
}

* Beyaz boşlukları değiştirin, sadece örtün;)

if($("#element").html() === "")
{

}

Arıyorsunuz jQuery.isEmptyObject()?

http://api.jquery.com/jquery.isemptyobject/

Https://stackoverflow.com/a/6813294/698289 adresine dayanan bir jQuery filtresi

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

JavaScript

var el= document.querySelector('body'); 
console.log(el);
console.log('Empty : '+ isEmptyTag(el));
console.log('Having Children : '+ hasChildren(el));


function isEmptyTag(tag) { 
    return (tag.innerHTML.trim() === '') ? true : false ;
}
function hasChildren(tag) {
    //return (tag.childElementCount !== 0) ? true : false ; // Not For IE
    //return (tag.childNodes.length !== 0) ? true : false ; // Including Comments
    return (tag.children.length !== 0) ? true : false ; // Only Elements
}

bunlardan herhangi birini kullanmayı deneyin!

document.getElementsByTagName('div')[0];
document.getElementsByClassName('topbar')[0];

document.querySelectorAll('div')[0];
document.querySelector('div'); // gets the first element.
​

Bunu dene:

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

Satır kesmeleri FF'deki öğelerin içeriği olarak kabul edilir.

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

Ör:

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

IE'de her iki div de boş kabul edilir, FF'de bir Chrome yalnızca sonuncusu boştur.

@Qwertymk tarafından sağlanan çözümü kullanabilirsiniz

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

veya

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