Introduction to JavaScript DOM

What is Dom?

The Document Object Model (DOM) is a standard programming interface recommended by the W3C organization for processing extensible markup languages. The history of the Document Object Model can be traced back to the "browser war" between Microsoft and Netscape in the late 1990s. In order to compete for life and death in JavaScript and JScript, both parties gave browsers powerful functions on a large scale. Microsoft has added many proprietary things to web technology, including VBScript, ActiveX, and Microsoft's own DHTML format, which makes many web pages unable to display properly using non-Microsoft platforms and browsers. DOM is the masterpiece brewed at that time.

DOM (Document Object Model) is the application programming interface (API) of HTML and XML. DOM will plan the entire page into a document composed of node levels.

The so-called Document Object Model is actually an internal representation of various elements in the HTML of a web page, such as headers, paragraphs, lists, styles, IDs, etc. in HTML. All elements can be passed through the DOM Come visit.

JavaScript ultimately needs to operate the Html page and turn Html into DHtml, and the DOM is required to operate the Html page. DOM simulates the Html page into an object. If JavaScript only performs some calculations, loops and other operations, but cannot operate Html, it will lose the meaning of its existence.

DOM is the model of the Html page. Each tag is treated as an object. JavaScript can programmatically control text boxes, layers and other elements in the web page by calling the properties and methods in the DOM. For example, by manipulating the DOM object of the text box, you can read and set the value in the text box.

JavaScript can change all HTML elements in the page

JavaScript can change all HTML attributes in the page

JavaScript can change all CSS styles in the page

JavaScript is able to react to all events in the page

Find HTML elements

Usually, with JavaScript, you need to manipulate HTML elements.

In order to do this, you must first find the element. There are three ways to do this:

Find the HTML element by id

Find the HTML element by tag name

Find the HTML element by class name

The simplest way to find an HTML element in the DOM is by using the element's id.

       
 
 我是第一个P
 
 我是第二个P
 
   

Find HTML elements by tag names

       
 
 我是第一个P
 
 我是第二个P
 
   

##Find HTML elements by class names

       
 
 我是第一个P
 
 我是第二个P