pages loaded by the D:document document browser
DOM O:object object pages and any elements in the page are objects
Organization of elements in the M:module model page
Dom is designed by the consortium as a platform-independent, language-independent API, through which programs or scripts dynamically access, modify the content, style, and structure of the document.
Dom is a code of practice for Web browsers, and JavaScript has made its Web standard language a virtue of DOM, achieving the so-called "write-and-run" goal in the Web world.
The Document Object Model (MODEL,DOM) is a programming interface for HTML and XML documents. It provides a structured representation of documents that can change the content and presentation of documents. What we are most concerned about is that Dom links Web pages with scripts and other programming languages.
Script developers can control, manipulate, and create dynamic Web page elements through the properties, methods, and events of document objects. Each page element (an HTML tag) corresponds to an object (object, the so-called "objects"), in the words "things" in white. The Word object is usually translated into "objects" in Taiwan. The labels on the Web page are nested, the outermost layer is <HTML>, and the Document Object model is nested like this, but is usually understood as a tree shape. The root is the window or Document object, which is the outer edge of the outermost label, the entire document. Beneath the roots (the tree's picture is usually inverted), like a genetic pedigree or a genealogy. The root is the only common ancestor) is the child level object, the child object also has its own child object, in addition to the root object, all objects have their own parent object, the same object child object is a sibling relationship.
In this framework of the "single Breed Family Map tree" composed of "father and son brothers", each page element can be positioned exactly. The Document Object model organizes the entire Web page into a tree-like structure in which each element of the tree is treated as a node. Various programming languages, including JavaScript, can access and change the details of a Web page through the Document Object model.
The World Wide Web Association (Wide) has developed a set of standards for the Document object model and is developing more relevant standards. In addition to supporting some of these standards, contemporary browsers support some of the historical programming interfaces that were popular before the standard of the consortium was developed. That is to say, the history of technology used by browsers is so complicated that some people generally use DOM technology without standards.
We will delve into the details of all common DOM (including some of the "different" technologies in IE browsers) to fully grasp the practice-oriented technology.
Dom and JavaScript
I often asked in QQ, MSN and email "about JavaScript" problem, 95% is actually DOM problem. People are not accustomed to talking about DOM, or JavaScript, or "Ajax" (once-popular "concept"), which has just cooled down recently, as "DHTML" at the end of the century. I personally feel very relieved about the emergence of these hot words, because each time it brings people to the hot stuff of JavaScript technology. What's the next hot word? Maybe we can cook one and maybe ... Pseudo-mashup, how about it? ）。
All of the things we do with JavaScript in a Web page are done through the DOM. The DOM belongs to the browser, not the core of the rules in the JavaScript language specification, so if you download a JavaScript language reference help document to look up, even including women's document.write method is not found.
The purpose of this code is to display the URLs of all the links in the Web page one at a time, and the part that is marked red in the code is DOM.
Copy Code code as follows:
var anchortags = document.getElementsByTagName ("a");
for (var i = 0; i < anchortags.length; i++)
{
Alert ("Href of this A:" + anchortags[i].href + "\ n");
}
So what is the core JavaScript, which is DOM, what the role of each, you can at a glance.
var anchortags =
A JavaScript variable named Anchortags was created.
document.getElementsByTagName ("a")
The document interface is the first interface defined in the DOM1 core (DOM1 Core) specification, and document is a host object that implements the document interface. Document controls everything on the Web page.
The DOM1 core defines the getElementsByTagName () method for the document interface. This method returns a list of nodes (NodeList), a DOM-specific array containing nodes, containing all tags that match the criteria for matching parameters, in the order in which they appear in the document. So the anchortags variable is now a list of nodes.
;
A semicolon is a statement-ending symbol in JavaScript.
for (var i = 0; i <
This is a typical "for loop" in the programming language. The loop variable i is declared, and each node in the Anchortags node list is processed individually. It's also a JavaScript thing.
Anchortags.length
The DOM1 core defines the length property of the NodeList interface. This property returns an integer that is the number of nodes contained in the node list. The JavaScript array also has a length attribute.
; i++) {
A typical javascript variable is increased by 1 operations.
Alert
Alert () is a Dom method that pops up a prompt box showing the arguments passed to the method (string). This is one of a number of historical programming interfaces that are commonly known as Level 0 dom (DOM levels 0) or DOM0. DOM0 is a set of "supported by some browsers" programming interface (in fact, there is no browser that does not support DOM0 in the market, only in the collection of some software enthusiasts), and does not belong to any DOM standard specification.
"Href of this a element is:" +
A literal number of strings and a string link character. JavaScript stuff.
Anchortags[i].href
HREF is the property of the Htmlanchorelement interface defined in the DOM1 HTML specification, returning the value of the href attribute of the link (<a>) element.
Here we use a usage like anchortags[i], which is the same syntax for accessing the first array of items in JavaScript. The so-called "Dom way" of language neutrality (language-neutral, specifically language-independent) accesses an item in a list of nodes by using the item () method defined in the NodeList interface: Anchortags.item (1). href. But most JavaScript implementations allow you to use this simple array-like syntax, which is the way most people actually use it.
+ "\ n");
Another string connection. Add a carriage return at the end of the string.
}
"For Loop" end.
