Có thể sao chép các đối tượng phần tử html trong JavaScript/JQuery không?

Question

Tôi đang tìm một số mẹo về cách giải quyết vấn đề của mình.

Tôi có phần tử html (như trường nhập hộp chọn) trong bảng. Bây giờ tôi muốn sao chép đối tượng và tạo một đối tượng mới ra khỏi bản sao và với JavaScript hoặc jQuery. Tôi nghĩ rằng điều này sẽ làm việc bằng cách nào đó nhưng tôi là một chút không biết gì vào lúc này.

Something như thế này (pseudo code):

Answer 1

Cách jQuery (không phải là hiệu quả nhất):

Nhìn vào phương pháp clone() của JQuery

Sử dụng mã của bạn, bạn có thể làm một cái gì đó như thế:

$('#ddl_1').clone().attr('id', newId).appendTo('p'); // append to where you want 

Answer 2

Nó thực sự rất dễ dàng trong jQu ery:

$("#ddl_1").clone().attr("id",newId).appendTo("body"); 

Thay đổi .appendTo() tất nhiên ...

Answer 3

Trong một dòng:

$('#selector').clone().attr('id','newid').appendTo('#newPlace'); 

Answer 4

Với javascript mẹ đẻ:

newelement = element.cloneNode(bool) 

nơi boolean cho biết sao chép các nút con hoặc không

Answer 5

Có, bạn có thể sao chép con của một phần tử và dán chúng vào các yếu tố khác:

var foo1 = jQuery('#foo1'); 
var foo2 = jQuery('#foo2'); 

foo1.html(foo2.children().clone()); 

Proof: http://jsfiddle.net/de9kc/

Answer 6

Hãy thử điều này:

$('#foo1').html($('#foo2').children().clone()); 

Answer 7

Bạn cần phải chọn "# foo2" làm công cụ chọn của bạn. Sau đó, lấy nó bằng html().

Đây là html:

<div id="foo1"> 

</div> 
<div id="foo2"> 
    <div>Foo Here</div> 
</div>​ 

Đây là javascript:

$("#foo2").click(function() { 
    //alert("clicked"); 
    var value=$(this).html(); 
    $("#foo1").html(value); 
});​ 

Dưới đây là jsfiddle: http://jsfiddle.net/fritzdenim/DhCjf/

Answer 8

Bạn có thể sử dụng clone() phương pháp để tạo ra một copy ..

$('#foo1').html($('#foo2 > div').clone())​; 

FIDDLE HERE