javascript 如何将DOM中已有的jQuery元素追加到另一个元素中?

insrf1ej  于 2022-11-20  发布在  Java
关注(0)|答案(5)|浏览(200)

我想获取一个已经在DOM中的页面上的元素,并将其附加到DOM中的另一个<div>或元素。
我不想附加字符串,但我使用了以下代码:

$("#dialog-form-Member").append($("div#MemberFormWrapper"));

它把我的元素放到我想要的地方,* 但是 * 它也去掉了第一个元素,以便把它放到另一个元素中。
示例:

<div id="one">
  I want to put this div into div two without div one disappearing. Keep both divs visible at the same time.
</div>

<div id="two">
  I want the content of div one to show here and keep both divs visible.
</div>

如果有人有任何建议,请让我知道。

thigvfpy

thigvfpy1#

您需要在追加之前克隆元素,以便保留原始元素。

$("#dialog-form-Member").append($("div#MemberFormWrapper").clone());

为了保留事件处理程序和/或数据,请检查clone方法@http://api.jquery.com/clone/的参数版本
摘录自http://api.jquery.com/clone/
说明:创建匹配元素集的深层副本。
添加版本:1.0.clone([ withDataAndEvents ])withDataAndEvents一个布尔值,指示事件处理程序是否应该与元素沿着复制。从jQuery 1.4开始,元素数据也会被复制。
添加版本:1.5.clone([ withDataAndEvents ],[ deepWithDataAndEvents ])withDataAndEvents一个布尔值,指示事件处理程序和数据是否应该与元素沿着复制。默认值是false。* 对于1.5.0,默认值是不正确的true。在1.5.1和更高版本中,这将改回false。
deepWithDataAndEvents布尔值,指示是否应复制克隆元素的所有子元素的事件处理程序和数据。默认情况下,其值与第一个参数的值匹配(默认为false)。

7hiiyaii

7hiiyaii2#

我相信你要找的是clone()

nzk0hqpo

nzk0hqpo3#

您要追加整个元素,只需要HTML。

$("#two").append($("#one").html());

输出:

<div id="one">
     I want to put this div into div 2 without div one disappearing. Keep both divs visible at the same time.
</div>

<div id="two">
     I want div one content to show here and keep both divs visible.  I want to put this div into div 2 without div one disappearing. Keep both divs visible at the same time.
</div>

或者,正如其他答案所建议的,您可以使用clone(),但要小心,因为这将使2个元素具有ID one,这是一个问题。

$("#two").append($("#one").clone());

输出:

<div id="one">
     I want to put this div into div 2 without div one disappearing. Keep both divs visible at the same time.
</div>

<div id="two">
     I want div one content to show here and keep both divs visible.
     <div id="one">
         I want to put this div into div 2 without div one disappearing. Keep both divs visible at the same time.
     </div>
</div>

请注意,有2个one元素,您需要更改其中一个元素的ID。

$('#one', '#two').attr('id', 'three');
nkkqxpd9

nkkqxpd94#

clone追加之前的元素。

$("#two").append($("div#one").clone());

Demo

1wnzp6jl

1wnzp6jl5#

使用.clone()制作一个完整的(深层)副本,并将其附加到您要添加它的元素中...

$('div#MemberFormWrapper').clone().appendTo('#dialog-form-Membe');

相关问题