Phương thức cloneNode() của HTML DOM Element

Định nghĩa và cách sử dụng

Phương thức cloneNode() Phương thức tạo bản sao của nút và trả về bản sao đó.

Phương thức cloneNode() Phương thức sao chép tất cả thuộc tính và giá trị của chúng.

Nếu bạn muốn sao chép hậu duệ (con), hãy đặt tham số deep thành true.

Chèn lại

Để chèn lại nút sao chép vào tài liệu, hãy sử dụng:

Phương thức appendChild()

Phương thức insertBefore()

Xin xem thêm:

Phương thức adoptNode()

Phương thức importNode()

Phương thức createElement()

Phương thức createTextNode()

Mẫu

Ví dụ 1

Sao chép phần tử <li> từ "myList2" vào "myList1":

const node = document.getElementById("myList2").lastChild;
const clone = node.cloneNode(true);
document.getElementById("myList1").appendChild(clone);

Trước khi sao chép:

  • Coffee
  • Tea
  • Water
  • Milk

Sau khi sao chép:

  • Coffee
  • Tea
  • Milk
  • Water
  • Milk

Thử ngay

Ví dụ 2

Sao chép phần tử "demo", bao gồm thuộc tính và phần tử con, và thêm vào tài liệu:

const node = document.getElementById("demo");
const clone = node.cloneNode(true);
document.body.appendChild(clone);

Thử ngay

Cú pháp

node.cloneNode(deep)

Tham số

Tham số Mô tả
deep

Tùy chọn.

  • false - Mặc định. Chỉ sao chép nút và thuộc tính
  • true - Sao chép nút, thuộc tính và hậu duệ

Giá trị trả về

Loại Mô tả
Đối tượng Node Nút được sao chép.

Hỗ trợ trình duyệt

element.cloneNode() Là tính năng DOM Level 1 (1998).

Tất cả các trình duyệt đều hỗ trợ hoàn toàn nó:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Hỗ trợ 9-11 Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ