Home > Developer > JavaScript
The DOM is all called the DocumentObject model, the Document object models, which are APIs for HTML and XML documents. It depicts a hierarchical node tree that runs a developer to add, remove, and modify portions of a page. Dom was developed by Netscape and Microsoft's founding DHTML, but now it has become a truly cross-platform, language-neutral way of showing and manipulating pages.
A Understanding of the DOM
The three letters in the DOM, D can be understood as the entire Web page document loaded;
Objects and so on, you can call properties and methods, here we are talking about the Document object, M can be regarded as the tree structure of the Web document.
1 nodes
When loading an HTML page, the Web browser generates a tree structure that represents the internal structure of the page, which the DOM understands as composed of nodes. As shown
From the tree structure we can see that HTML tags do not have parents, no brothers, so the HTML tag is the root tag, the head tag is an HTML sub-tag, and Meta and title tag is a sibling relationship. If each tag is treated as a node, then these nodes are combined into a tree of nodes.
2 node types
The nodes in the DOM are roughly divided into: element nodes, text nodes, and attribute nodes
Two Find element
W3 provides a convenient and simple method and properties for locating nodes, so that we can quickly operate on the nodes,
Listed below:
When we get to a particular element node through getElementById (), we get the node object, and through this node object, we can access a series of his properties.
So how do these attribute values come out?
Let's look at a simple little example:
<span style= "FONT-SIZE:18PX;" ><body><div id= "box" title= "test Page" class= "CLA" style= "Color:blue;" > Learn js, the front desk are not afraid! </div ></body>window.onload=function () {var obj= document.getelementbyid (' box '); alert (obj.tagname); alert (obj.innerhtml); alert (obj.id); alert (obj.title); alert (obj.style.color); alert (obj.classname);}; </span>As for the other methods are no longer one by one explained, want to know can go to check the relevant information.
Three DOM node
1 Node Properties
Node can be divided into three kinds, mentioned above, and these nodes have three very useful properties, respectively: NodeName,
NodeType, and NodeValue. The following are their instructions:
2 Hierarchy Node Properties
The hierarchy of nodes can be divided into two types: parent node and child node, sibling node. When we get one of the element nodes, we can use the Hierarchy node property to get the nodes of its related hierarchy.
Four Node operations
Dom can not only find nodes, but also create nodes, copy nodes, insert nodes, delete nodes, and replace nodes.
JavaScript Learning 7:dom Basics
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
