JavaScript document objects, Dom Basics
Learning Essentials:
1.DOM Introduction
2. Find elements
3.DOM node
4. Node operation
The DOM (document object Model) is an API (application Interface) for HTML and XML Documents. The DOM depicts a hierarchical node tree that runs a developer to add, remove, and modify portions of a page. Dom was born out of Netscape and Microsoft's founding DHTML (dynamic html), but now it has become a truly cross-platform, language-neutral way of showing and manipulating page Markers.
A. DOM Introduction
The three letters in the dom, D (document) can be understood as the entire Web page document loading, O (object) can be understood as a window object, such as things, can invoke properties and methods, here we are talking about the document object, M (model) can be understood as a Web document tree Structure.
Dom has three levels, namely DOM1, DOM2, DOM3, and DOM1 became the World's standard in October 1998. The browsers supported by DOM1 include ie6+, Firefox, Safari, chrome, and opera1.7+.
All DOM objects in Ps:ie are implemented in the form of COM objects, which means that the DOM in IE may differ somewhat from other Browsers.
1. node
When loading an HTML page, the Web browser generates a tree structure that represents the internal structure of the Page. The DOM understands this tree structure as composed of Nodes.
From the tree structure, we understand several concepts, HTML tags without fathers, no brothers, so the HTML tag is the root tag. The head tag is an HTML sub-tag, and the meta and title tags are sibling relationships. If each tag is treated as a node, then these nodes are combined into a tree of Nodes.
PS: We often use labels as elements in the back, which is a meaning.
2. Node type: element node, text node, attribute Node.
Element node, in fact, is the label
Attribute node, which is the property of this tag
Text node, which is the text that the label contains
<div title= "attribute node" > Test div</div>
Two Find element, element node
It provides a convenient and simple method and properties for locating nodes so that we can quickly operate on the Nodes. Respectively: getElementById (), getelementsbytagname (), getelementsbyname (), getattribute (), setAttribute (), and RemoveAttribute ( )。
Element Node method
Method |
Description |
getElementById () |
Gets the node for a specific ID element |
getElementsByTagName () |
Get a list of nodes of the same element |
Getelementsbyname () |
Get a list of nodes of the same name |
GetAttribute () |
Gets the value of a specific element node property |
SetAttribute () |
Set the value of a specific element node property |
RemoveAttribute () |
Remove specific Element node properties |
11
Section 113th, JavaScript document objects, Dom Basics