Question

我正在开发一个项目，我需要克隆span.response11，将其附加到#parent，然后将新div添加到span.response11。我已经完成了克隆过程但是在添加新div时，我的IF语句继续将div添加到已经附加了它的元素

这是我的jquery的小提琴： https://jsfiddle.net/4bmwbkgx/2/

// if this cloned element doesn't already have the child div.red, append it.
$("#parent > span").each(function(index, element) {
  if ($(element).not(":has(.red)")) {
    $(element).prepend('<div class="red">This is red</div>');
  }
});

我只希望将div.red添加一次。如果span.response已经将div.red作为子节点，则jquery不应再添加div。

如何让我的功能停止添加更多div？

Answer 1

如果span.response小时候已经div.red，则jQuery不应再添加div。

你不应该使用:has，它用于测试相同的元素。使用.find并检查是否有一个：

$("#parent > span").each(function(index, element) {
  // Do the below, only when `.red` is not there inside this element.
  if (!$(element).find(".red").length) {
    $(element).prepend('<div class="red">This is red</div>');
  }
});

另外，在另一个注释中，我强烈反对您在<div>内插入<span>，因为<span>是内联元素，而<div>是块1 ！

如果规则不再为真，则停止追加

1 个答案: