Dom definition
The DOM (Document Object model) is an API (application programming Interface) for HTML and XML documents, derived from Netscape and Microsoft's founding DHTML (Dynamic HTML). The DOM depicts a hierarchical tree of nodes that allows developers to add, remove, and modify portions of a page.
Node Tree definition
The DOM can portray any HTML or XML document as a structure composed of multiple nodes. The nodes are divided into several different types, each representing different information or tags in the document. Each node has its own characteristics, data, and methods, and there is a relationship with other nodes. The relationships between nodes form a hierarchy, and all page markers behave as a node tree with a specific node as the root node.
"Root node and document element"
The document node is the root node of each document the,
Node type
The DOM1 class defines a node interface that will be implemented by all node types in the DOM. This node interface is implemented as a node type in JavaScript, and all DOM objects in the Ie8-browser are implemented as COM objects.
Note Ie8-does not support access to the node type in the DOM, but supports numeric value notation
return undefined console.log in ie8-(node.element_node)// return true<div class= "box" id= "box" in all browsers > </div><script>var oBox = document.getElementById (' box '); Console.log (Obox.nodetype = = 1) < /script>
"12 node types" 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 nodes type.
Node.element_node (1); Node.attribute_node (2); Node.text_node (3); Node.cdata_section_node (4); Node.entry_reference_node (5); Node.entity_node (6); Node.processing_instruction_node (7); Node.comment_node (8); Node.document_node (9); Node.document_type_node (ten); Node.document_fragment_node (one); Node.notation_node (n);
<! DOCTYPE html>//"1" Element nodevar nodeelement =Document.body;console.log (Nodeelement.nodetype,nodeelement.nodetype==node.element_node);//1 true//The "2" element attribute is represented in the DOM as a attr type, a node that exists in the attributes attribute of the element, but is not part of the DOM document tree.var nodeattribute = document.getElementById ("box"). Attributes[0]; Console.log (nodeattribute.nodetype,nodeattribute.nodetype = = Node.attribute_node)//2 true//"3" Text nodevar nodetext =Document.body.firstelementchild.firstchild;console.log (Nodetext.nodetype,nodetext.nodetype = = Node.TEXT_NODE)//3 true//The "4" cdatasection type is only for XML-based documents and only appears in the XML document, which represents a CDATA region//"5" Entity_reference_node entity reference name node//"6" Entity_node Entity name node//"7" Processing_instruction_node processing instruction node//"8" Comment nodevar nodecomment = document.body.childnodes[1];console.log (Nodecomment.nodetype,nodecomment.nodetype = = Node.comment_node)//8 true//"9" Document nodevar nodedocument =Document;console.log (Nodedocument.nodetype,nodedocument.nodetype==node.document_node);//9 true//var Nodedocumenttype = Document.firstchild;console.log (Nodedocumenttype.nodetype, Nodedocumenttype.nodetype==node.document_type_node); //10 true//var nodedocumentfragment = Document.createdocumentfragment (); Console.log (Nodedocumentfragment.nodetype,nodedocumentfragment.nodetype = = Node.document_fragment_node) //11 True//
DOM node type