如何使用jquery将内容添加到第一个空div或插入后如果不为空？

Question

我有以下内容......

              <div class="sectionA"></div>
              <div class="sectionA"></div>
              <div class="sectionA"></div>
              <div class="sectionA"></div>

首先，我需要将内容附加到第一个空div ...所以我尝试了这个：

              if(".sectionA").is(":empty"))
              {
                   alert("empty div")
                   $(this).append(value);
              }else // if no available empty divs then insert after last div
              {
                   $(".sectionA:last").after("<div>"+value+"</div>");
              }

这个逻辑不起作用，警报（“空div”）测试永远不会触发，我知道有通过Firebug验证的空div。知道我在这里做错了吗？

Answer 1

您遇到语法错误：

if ( $(".sectionA").is(":empty") )
// ^ ^ You're missing the parentheses & dollar sign.

---

但是，你的逻辑是有缺陷的。请改用：

var $sections = $(".sectionA");
var $empty = $sections.filter(':empty');

if ( $empty.length ) {
    $empty.first().append(value);
} else {
    $sections.last().after('<div>' + value + '</div>');
}

Answer 2

如果您需要将内容附加到第一个空div。您错过了$登录if条件

$(document).ready(function(){
  if($(".sectionA:first").is(":empty"))
  {
       alert("empty div")
       $(this).append(value);
  }else // if no available empty divs then insert after last div
  {
       $(".sectionA:last").after("<div>"+value+"</div>");
  } 
});

之后，您将获得alert("empty div")测试触发器。之后，您可以执行逻辑以追加价值。