Web APIs: Đối tượng Node

Web APIs: Đối tượng Node

Đối tượng Node đại diện cho một nút duy nhất trong cây tài liệu. Một Node có thể là nút phần tử, nút thuộc tính, nút văn bản hoặc bất kỳ loại nút nào khác.

Lưu ý rằng trong khi tất cả các đối tượng thừa kế các thuộc tính / phương thức của nút để giao dịch với nút cha và nút con, không phải tất cả các đối tượng đều có thể có cha mẹ hoặc con cái. Ví dụ: Các nút văn bản có thể không có nút con và việc thêm nút con vào các nút này sẽ dẫn đến lỗi DOM.

Các thuộc tính

  • Node.childNodes Read only

    Trả về một NodeList thực chứa tất cả các nút con của nút này. NodeList thực này sẽ bị thay đổi nếu bất kỳ Node con của nó bị thay đổi, đối tượng NodeList thực sẽ tự động được cập nhật.

  • Node.firstChild Read only

    Trả về một Node là nút con trực tiếp đầu tiên, hoặc null nếu nút không có nút con.

  • Node.nextSibling Read only

    Trả về một Node là nút tiếp theo trong dãy, hoặc null nếu không có nút tiếp theo.

  • Node.nodeName Read only

    Trả về a DOMString chứa tên của Node. Cấu trúc của tên nút sẽ khác với loại nút. Ví dụ một HTMLElement sẽ chứa tên của thẻ tương ứng, như "audio" cho một HTMLAudioElement, một nút Text sẽ có giá trị dạng chuỗi là "#text", hoặc một nút Document sẽ có giá trị dạng chuỗi là "#document".

  • Node.nodeType Read only

    Trả về một giá trị kiểu unsigned short đại diện cho loại nút. Các giá trị khả thi là:

    Tên hằng số Giá trị
    ELEMENT_NODE 1
    TEXT_NODE 3
    PROCESSING_INSTRUCTION_NODE 7
    COMMENT_NODE 8
    DOCUMENT_NODE 9
    DOCUMENT_TYPE_NODE 10
    DOCUMENT_FRAGMENT_NODE 11
    Các giá trị không liệt kê, một số đã không còn hiệu lực, và một số sẽ bị loại bỏ trong các phiên bản HTML và Javascript mới hơn trong tương lai.
  • Node.nodeValue

    Trả về / Gán giá trị cho node hiện hành

  • Node.parentNode Read only

    Trả về giá trị dạng Node là cha của node này. Nếu không tìm được, hoặc nếu nút này là đỉnh của cây, hoặc nếu nút này không tham gia vào một cây, thì thuộc tính này trả về null.

  • Node.parentElement Read only
    Trả về giá trị dạng Element là cha của node này. Nếu nút không có nút cha, hoặc nếu nút cha của nó không phải là một Element, thì thuộc tính này trả về null.
  • Node.textContent

    Trả về / Gán nội dung văn bản của một phần tử và tất cả các phần tử của nó.

Các phương thức

  • Node.appendChild()

    Thêm một đối số childNode cụ thể vào sau cùng của nút hiện tại.
    Nếu đối số tham chiếu một nút hiện có trên cây DOM, nút đó sẽ được tách ra khỏi vị trí hiện tại của nó và được gắn vào ở vị trí mới.

  • Node.cloneNode()

    Tạo bản sao của một Node, và tùy chọn, tất cả nội dung của nó. Theo mặc định, phương thức này nhân bản nội dung của nút.

  • Node.contains()

    Trả về một giá trị Boolean cho biết liệu nút hiện tại có chứa một nút nào đó hay không.

  • Node.getRootNode()

    Trả về gốc của đối tượng ngữ cảnh có tùy chọn bao gồm shadow root nếu nó có sẵn

  • Node.hasChildNodes()

    Trả về a Boolean chỉ ra nếu phần tử có bất kỳ nút con nào hay không.

  • Node.insertBefore()

    Chèn một nút Node vào tập họp nút con của nó và đứng trước một nút con mà bạn chỉ định.

  • Node.isEqualNode()

    Trả về giá trị Boolean cho biết hai nút có bằng nhau hay không, nghĩa là cùng loại và tất cả các điểm dữ liệu xác định của chúng giống nhau.

  • Node.isSameNode()

    Trả về một giá trị Boolean cho biết hai nút có giống nhau hay không (nghĩa là chúng tham chiếu cùng một đối tượng).

  • Node.lookupPrefix()

    Trả về DOMString có chứa tiền tố cho một namespace URI đã cho, nếu có, và null nếu không. Khi có nhiều tiền tố, kết quả sẽ phụ thuộc vào việc triển khai thực hiện.

  • Node.removeChild()

    Loại bỏ nút con khỏi phần tử hiện tại, phải là nút con của nút hiện tại.

  • Node.replaceChild()

    Thay thế một Node con của nút cha hiện tại thành một nút thứ hai được đưa ra trong tham số.

  • Node.querySelector(String selector)

    Trả về phần tử đầu tiên là phần tử con của phần tử mà nó được gọi ra khớp với nhóm bộ chọn được chỉ định.

Ví dụ

Xóa tất cả các nút con được lồng trong một nút

Element.prototype.removeAll = function () {
  while (this.firstChild) { this.removeChild(this.firstChild); }
  return this;
};

Sử dụng mẫu

/* ... một thay thế cho document.body.innerHTML = "" ... */
document.body.removeAll();

Tham khảo:

Các tính năng mặc định của trang web

Các trang web được Đại Phố thiết kế luôn mặc định các tính năng sau:

  • Mã nguồn được tối ưu với các công cụ tìm kiếm.
  • Trang web hỗ trợ thiết bị di động, tương thích với mọi thiết bị: điện thoại, máy tính bảng, máy tính và laptop. Sử dụng công nghệ HTML5, CSS3 Mobile Responsive.
  • Dễ dàng thay đổi theo phong cách riêng của bạn.
  • Dễ dàng thêm bớt số lượng các trang, và chỉnh sửa nội hiển thị trên website tùy ý
  • Phần quản trị rõ ràng, trực quan, dễ sử dụng với cả những người không chuyên về IT.

Quản lí nội dung: có thể dễ dàng thêm, xóa, sửa các thông tin trên website

  • Thông tin sản phẩm và dịch vụ của công ty
  • Thông tin dự án, đối tác Giới thiệu – Liên hệ
  • Thông tin giới thiệu, thông tin liên hệ
  • Tin tức
  • Hình ảnh trên website, sửa các tag alt, descriotion, caption
  • Hình ảnh và caption trên Slideshow
Xin vui lòng liên hệ với chúng tôi nếu cần thêm thông tin
Web hosting giá rẻ, Best WebHosting Offers, website chuẩn google, website tự động, website trọn gói, trang web có chức năng quản trị dễ sử dụng nhất, cập nhật nội dung website, thiết kế website, web template, giao diện web, chèn từ khóa vào trang web,