Well, I have been working for a while, and my understanding of programming has become deeper. I used to think that HTML/CSS/JAVASCRIPT was relatively simple and I could just read online tutorials. W3C is my go-to place for learning this knowledge. I went to a website. I am very grateful to her for letting me learn more about the front-end. But now I don’t see it that way. The most important thing for front-end engineers is to work through these (of course, there are definitely more issues to consider. It is broader and deeper, including architectural issues, compatibility issues, performance issues, various plug-ins, JS libraries and various front-end tools, etc.). These contents are very rich. I am also very interested and think so. More professional! At least it makes me feel that it is more fun than fixing bugs, modifying data for customers, writing some documents, testing, publishing, and switching back and forth between several projects every day! In the past, when I wrote blogs, I always wanted to write something that others had never written before, that I had personally experienced, and that was of some value to others and myself! Now I feel that my learning experience should be recorded. After all, even simple knowledge will gradually become blurred with the passage of time if it is not used frequently. Recording it, even if it is organized according to my own understanding, can Deepen your understanding of knowledge! I am not a genius. I have no formulas, no codes, and no special way of understanding the world in my head. So I will choose to go step by step in a down-to-earth manner!
1: What is HTML DOM?
Let’s first look at the structure of a simple HTML document
<!DOCTYPE html><html lang="en"> <head> <link rel=stylesheet href=""> <meta charset="UTF-8"> <title>文档标题</title> </head> <body> <div>文本内容</div> <div> <div></div> </div> <table></table> </body></html>
If we rotate the entire document 90 degrees clockwise, we will see It looks like the following
The full English name of HTML DOM is: Hyper Text Markup Language Document Object Model translated into Chinese is the document object model of hypertext markup language. My understanding is to look at the HTML document from another perspective, as an upside-down DOM tree. The operation of the HTML document can be regarded as the operation of the DOM tree. Everything in the HTML document is mapped here. On a DOM tree!
W3C’s explanation is: DOM is a W3C standard. DOM defines standards for accessing HTML and XML documents (W3C DOM is a platform- and language-neutral interface that allows programs and scripts to dynamically access and update documents. content, structure and style. ) The W3C standard is divided into 3 different parts:
1) Core DOM?? A standard model for any structured document
2) XML DOM?? Standard model for XML documents
3) HTML DOM?? Model for HTML documents
We only care about HTML DOM here. The official description is:
1) HTML standard object model
2) HTML standard programming interface
3) W3C standard
HTML DOM defines the objects and attributes of all HTML elements, as well as accessing them method. To put it simply, HTML DOM is a standard on how to obtain, modify, add or delete HTML elements. That is to change the method of operating HTML documents. The main thing is to add the participation of JAVASCRIPT, a scripting language, to operate HTML documents!
2: What is the role of HTML DOM?
Well, the most important thing is to enhance the dynamic interactivity of the website, because you can use JAVASCRIPT or server-side scripts to control HTML documents!
3: What are the key points of the content of HTML DOM?
I think that after changing the HTML document into a DOM tree, you can operate on the DOM tree, whether it is modifying, adding, deleting, or changing the structure or style of the node. , the first step is always to obtain a node first, just like adding, deleting, modifying and checking the data in the database, the status of checking is very important! Therefore, we need to study the methods and attributes of query with special care!
4: The basic content of HTML DOM?
Before learning HTML DOM, you need to understand HTML/CSS/JAVASCRIPT. As expressed in the picture below, only the cooperation of these four can make the display more flexible, colorful and fun. web page!
Of course, using the DOM tree to express HTML documents must also have its own set of control methods. We need to comprehensively change the perspective. We need to learn some methods to obtain nodes in the DOM tree, modify nodes, add nodes, delete nodes; change the style, structure, etc. of nodes. We need to learn some various types of nodes and node attributes. Content, related to HTML, we need to know what tag a certain node is, its attributes, its events, its connection with other nodes, etc. You can think of more reasonable ways and methods to control the DOM tree. , attributes, events, etc. HTML DOM has been thought of for us. These are what we need to learn!
Well, the goal of this article is to give me a clearer understanding of HTML DOM, let me know what it is, what it is used for, and what content it contains, and then I will slowly upload its content. Supplement it! Thanks W3C!