Как скрыть/удалить DIV при пустом

У меня есть выход HTML на стороне сервера, с которым я не могу справиться, используя чистый CSS, по существу DIV иногда держится:

<div><span>Content</span></div>

или

<div><p>Content</p></div>

или

<div>Content</div>

или

<div> </div>

Когда DIV == <div> </div>, я хочу удалить его.

Любые идеи?

ОТВЕТЫ

Ответ 1

Еще лучше (предполагая jQuery):

$(document).ready(function() { $('div:empty').remove(); });

EDIT: другие ответы хороши, но OP хотел удалить пустой элемент, а не скрывать его.

Ответ 2

Вы можете сделать это, используя только CSS:

div:empty { display: none }

Ответ 3

Я думаю, вы можете сделать следующее:

$(function() {
  $("div:empty").hide();
});

jQuery empty псевдоселектор отлично.

Ответ 4

Вот еще один простой способ... используя фильтр()...

$('div').filter(function() {

  return $.trim($(this).text()) === ''

}).remove()

Ответ 5

Вы также можете использовать CSS-only для решения этой проблемы, поместив таблицу с style="empty-cells:hide" вокруг содержимого и изменив div на td, например:

До:

<div>Content</div>

После:

<table style="empty-cells:hide"><tr><td>Content</td></tr></table>