0

HTML:

<div class="here">This is here</div>
<div class="insert">This is to be inserted</div>

jQuery:

$(document).ready(function() {
  var $m = $(".insert");
  $(".here").before($m);
});

它会产生预期的结果 - 剪切insertdiv 并将其粘贴到herediv 之前。但如果代码如下,

$(".here").before($m, $m);

theninsert不会在herediv 之前出现两次。但是,如果我按div以下方式使用第一个参数以外的第二个参数:

$(".here").before($m, $('<div class="insert2">This is insert 2</div>'));

然后两者都insert出现insert2 divshere div.

如果两个参数相同,为什么两个divs不出现在前面?here div

4

3 回答 3

2

您正在做的是将现有元素从一个地方移动到另一个地方;您没有创建它的其他副本。使用方法创建副本.clone()并插入所需位置:

$(".here").before(
    $m         /*.attr("title", "original")*/,
    $m.clone() /*.attr("title", "copy # 1")*/,
    $m.clone() /*.attr("title", "copy # 2")*/
);

您的另一个示例创建了一个新元素,这就是它按预期工作的原因。

于 2013-11-12T08:54:08.187 回答
1

当您将现有的 DOM 元素作为 DOM 插入方法的参数时,它不会复制该元素,它只是将该元素移动到您指定的位置。一个 DOM 元素一次只能在一个地方,所以如果你指定同一个元素两次,它会移动两次。如果你想要元素的副本,你必须明确地制作它们:

$(".here").before($m, $m.clone());
于 2013-11-12T08:54:35.477 回答
0

那是因为一个元素只能存在一次。你说在$(".here").before($m, $m);'.here'之前插入element_x,而不是在'.here'之前插入element_x。所以它被移动,然后再次移动到同一个地方。

随着$(".here").before($m, $('<div class="insert2">This is insert 2</div>'));您在第二个参数中创建一个新元素,这样可以正常工作。

要复制元素以将其插入两次,您可以克隆该元素并同时插入:

var $m2 = $m.clone();
$(".here").before($m, $m2);
于 2013-11-12T09:00:51.060 回答