如果元素不为空,则添加内容

Question

HTML:

<div id="parent"> 
  <div class="child"></div> 
  <div class="child"><p>Div with content<p></div> 
  <div class="child"><img scr="pic.png" alt="Div with picture" /></div>
</div>

结果我想:

<div id="parent"> 
  <div class="child"></div> 
  <div class="child"><h1>title</h1><p>Div with content<p></div> 
  <div class="child"><h1>title</h1><img scr="pic.png" alt="Div with picture" /></div>
</div>

我的jQuery代码:

$(".child").each(function() {
    if ($(this).html != '')
        $(this).prepend('<h1>title</h1>');
});

我的jQuery代码的结果:

<div id="parent"> 
  <div class="child"><h1>title</h1></div> 
  <div class="child"><h1>title</h1><p>Div with content<p></div> 
  <div class="child"><h1>title</h1><img scr="pic.png" alt="Div with picture" /></div>
</div>

所以我只想为某个不是空的类的每个div添加一个标题.

Answer 1

$(".child:not(:empty)").prepend('<h1>title</h1>');

jQuery空选择器

Answer 2

$(".child").each(function() {
    if ($(this).html())
        $(this).prepend('<h1>title</h1>');
});

Answer 3

$("#parent .child").each(function() {
    if ($.trim($(this).html()).length > 0 )
        $(this).prepend('<h1>title</h1>');
});