jquery clone chỉ nội dung của phần tử

Question

Có cách nào trong jQuery sao chép nội dung của phần tử không? Không phải toàn bộ phần tử, chỉ có nội dung (trẻ em).

Điều gì đó tương tự như những gì .html() đang làm, nhưng tôi cũng quan tâm đến việc nhân bản các sự kiện được đính kèm với nội dung.

Tôi đã xem .clone, nhưng có vẻ như là nhân bản toàn bộ phần tử.

Cảm ơn.

Answer 1

Doua Beri, với tham chiếu đến the jQuery API documentation for .clone() bạn sẽ thấy rằng những gì bạn muốn là .clone(true,true). Điều này sẽ tạo một bản sao sâu của một phần tử (hoặc một tập hợp các phần tử), bao gồm tất cả các ràng buộc dữ liệu và sự kiện.

Sau đó, bạn có thể chọn hai tùy chọn về cách bạn sử dụng .clone(true,true).

1. Sao chép riêng từng trẻ để cung cấp cho bộ sưu tập jQuery chứa các bản sao của trẻ.

   var $childClones = $("#myElement").children().clone(true,true);

2. Clone các yếu tố bên ngoài để cung cấp cho một bộ sưu tập jQuery bao gồm một bản sao của phần tử bên ngoài, bản thân có chứa nhái của những đứa trẻ.

   var $clone = $("#myElement").clone(true,true);

Nó là hơi hàn lâm mà cách tiếp cận bạn áp dụng. Trong cả hai trường hợp, các phần tử con cháu có sẵn chung hoặc riêng lẻ để được thao tác và/hoặc được chèn vào DOM, mặc dù mã để làm như vậy sẽ khác đôi chút.

Answer 2

Nếu bạn thích một sâu bản sao chỉ cần sao chép các trẻ em:

$('#footer-flair').children().clone()

Và thay vì gắn các sự kiện đến các yếu tố đặc biệt đính kèm một sự kiện vào một yếu tố container được nghe phần tử con, như vậy bạn sự kiện sẽ kích hoạt miễn là phần tử vùng chứa vẫn còn ngay cả khi bạn thêm/xóa hàng nghìn phần tử bên trong vùng chứa. Bạn có thể làm điều này trên thẻ body nếu bạn không bao giờ muốn các sự kiện của bạn biến mất.

Sử dụng 'bật' phương pháp để ràng buộc các sự kiện như vậy:

$('body').on('click', 'button.className', function(){ 
    alert('button clicked'); 
});