Jquery克隆方法在页面内克隆mutliple(多个)div(不是单个div)

时间:2015-05-29 19:49:17

标签: javascript jquery html

我需要一种克隆4个div的方法,其中id为d_1,d_2,d_3,d_4 包括每个div内的所有内容,然后分离所有div,然后我需要从克隆中找到d_1及其内容的副本,然后将其再次附加到页面。

类似的东西:

        var cloned=$('[id^="d_"]').clone();

        $('[id^="d_"]').detach();

然后从克隆中找到带有id =d_1的div并将其附加到正文。

有可能吗?

2 个答案:

答案 0 :(得分:1)

您可以appendTo()元素分离并将元素移动到其他位置。

var els = $('[id^="d_"]')

els.detach();

els.each(function() {
  if (this.id.indexOf('d_1') !== -1) {
    $(this).appendTo(document.body);
  }
});

// do something else with els later, too.

答案 1 :(得分:1)

使用文档片段。

var $documentFragment = $(document.createDocumentFragment());
$('[id^="d_"]').each(function(){
   $documentFragment.append($(this).clone().addClass("_cloned"));
});

$documentFragment.clone().appendTo(document.body);

如果要在片段中查找元素,可以执行以下操作:

$(document.body).find("#d_1._cloned"). ... ;

如果要删除所有元素,然后仅将第一个复制到片段中添加:

$("._cloned", document.body).remove();
$documentFragment.find("#d_1").clone().appendTo(document.body);