1. What is DOM?
The DOM (Document Object model) is an API (Application programming Interface) for HTML and XML documents. The DOM depicts a hierarchical tree of nodes that allows developers to add, remove, and modify portions of a page.
2. Node hierarchy
Document nodes are the following nodes for each document. The document element is the outermost element of the document, and all other elements in the document are contained within the document element. In an HTML page, the document element is always an element. In XML, there are no predefined elements, so any element can be a document element.
Each piece of markup can be represented by a node in the tree: The HTML element is represented by an element node, the attribute (attribute) is represented by an attribute node, the document type is represented by a document type node, and the comment is represented by an annotation node. There are 12 node types, all of which inherit from a base type.
2.1 Node Type
The node interface is implemented as a node type in JavaScript, and all node types in JavaScript inherit from the node type. Therefore, all node types share the same basic properties and methods. each node has a NodeType property that indicates the type of the node. The node type is represented by the following 12 numeric constants defined in the node type, and any node type must reside in one of these:
- Node.element_node (1);
- Node.attribute_node (2);
- Node.text_node (3);
- Node.cdata_section_node (4);
- Node.entity_reference_node (5);
- Node.entity_node (6);
- Node.processing_instruction_node (7);
- Node.comment_node (8);
- Node.document_node (9);
- Node.document_type_node (10);
- Node.document_fragment_node (11);
- Node.notation_node (12);
JavaScript Advanced Programming: Chapter Tenth-DOM