The DOM document object model (DOM)
//host object: DOM object BOM
One, the DOM document object model (DOM)
What is the DOM?
Full name - DOM Document Object Model Document Object Model (DOM)
- through the DOM in JS to manipulate HTML document, as long as the understanding of DOM can operate the WEB page,
Documents: the document representation is the whole HTML page document
Object: the object representation transform every parts of the web pages are to an object
Model: use the model to represent the object, the relationship between the object so we facilitate access to
What is a node?
1. The Node Node is constitute the most basic part of our web page, the page every part can be called a Node
Such as: HTML tags and attributes, text, notes, the entire document is a node, such as
Although is a node, but in fact their specific types are different, such as: label we called element nodes, called attribute node, text is called a text node, the document called the document node
2. The node types, properties and methods are also different
//the Node - constitute the most basic unit of the HTML document,
Common node is divided into four categories
- a document node: the entire HTML document 4
1. The document, represents the entire HTML document, all the nodes in a web page are its child nodes
2. The document object attributes of the object as a window, we don't have to get can directly use the
3. Through the object we can look for the node object within the entire document access, and can create all kinds of the node object through the object
-- element node in the HTML document HTML tags
1. The labels are all elements in the HTML node, this is also our most commonly used one node
2. All the labels in the browser page will be converted to an element node, we could be obtained by the method of document element node
Such as: document, getElementById ()
According to the id attribute value for an element node object
: (Text) - Text node
1. The text node represents outside the text content of HTML tags, any of the HTML text is a text node
2. The text node is generally as the child nodes of the element node being
3. Get the text nodes, the general first to get the element node, then get the text through the element node
For example:
1. Element node firstChild.
2. Obtain element node of the first child, general text node
Var h1=document. GetElementById (" ID ");//element node
The Console. The log (h1);
Var TXT=h1. FirstChild;//text node
The Console. The log (" TXT ");
- attribute node (Attr)
1. An attribute node said is an attribute of the tag, to note here is that an attribute node, is not the child nodes of the element nodes, but part of the element node
2. You can get specified by element node is a node
Such as: element Node. GetAttribu Node (" attribute name ")
Note: we don't usually use attribute node