Як перевірити, чи HTML елемент порожній за допомогою jQuery?

Я намагаюся викликати функцію лише в тому випадку, якщо елемент HTML порожній, використовуючи jQuery.

Щось на зразок цього:

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

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

для отримання додаткової інформації див. http://api.jquery.com/is/ та http://api.jquery.com/empty-selector/

Редагувати:

Як зазначали деякі, інтерпретація порожнього елемента в браузері може відрізнятися. Якщо ви хочете ігнорувати невидимі елементи, такі як пробіли та розриви рядків та зробити виконання більш послідовним, ви можете створити функцію (або просто використовувати код всередині неї).

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

Ви також можете перетворити його у плагін jQuery, але ви отримаєте ідею.

Я вважав, що це єдиний надійний спосіб (оскільки Chrome & FF розглядають пробіли та розриви рядків як елементи):

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

Пробіл та розрив рядків є головними проблемами використання пустого перемикача. Обережно, у CSS: пустий псевдоклас поводиться так само. Мені подобається цей метод:

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

!elt.hasChildNodes()

Так, я знаю, це не jQuery, тому ви можете використовувати це:

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

Щасливий зараз?

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

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

Якщо під "порожнім" ви маєте на увазі відсутність вмісту HTML,

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

Порожній як у тексті не містить тексту?

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

У резюме існує багато варіантів, щоб дізнатись, чи елемент порожній:

1- Використання html:

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

2- Використання text:

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

3- Використання is(':empty'):

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

4- Використання length

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

У залежності від наркотиків, якщо ви намагаєтесь дізнатися, чи введений елемент порожній, ви можете використовувати val:

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

Ще один варіант, який повинен вимагати менше "роботи" для браузера, ніж html()або children():

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

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

або

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

Ви можете спробувати:

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

* Замініть пробіли, просто пропись;)

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

}

Шукаєте jQuery.isEmptyObject()?

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

Ось фільтр jQuery на основі https://stackoverflow.com/a/6813294/698289

$.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
}

спробуйте використовувати будь-що з цього!

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

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

Спробуйте це:

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

Розриви рядків розглядаються як вміст до елементів у FF.

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

Наприклад:

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

У IE обидва диви вважаються порожніми, у FF Chrome лише порожній.

Ви можете використовувати рішення, яке надає @qwertymk

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

або

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