Learn what HTML5 is-H5 Tutorial-php.cn

If a non-technical person asked you, what is HTML5, how would you answer?

New HTML specification. . .

Provides browsers with powerful capabilities to do things that could not be done before. . . (To be precise, it should stipulate many new interface standards for browsers, requiring browsers to implement awesome functions...Thanks to Hongfeng Yiye for this)

　To browsers Many new interfaces are exposed. . .

A lot of new effects have been added. . .

The person who asked actually didn’t understand the real question he wanted to ask. The person who answered seemed to understand, but something seemed to be missing. Awesome capabilities, new interfaces, cool effects, the first person to answer was dizzy. What is HTML, what is CSS, what is DOM, what is JavaScript, most front-end developers use these every day, but few people think about the relationship between them.

First of all, the full name of HTML is Hypertext Markup Language, which is a computer language in the form of markup. By giving this markup language to a specialized parser, certain interface effects can be parsed. The browser is a parser that specializes in parsing this markup language. We say that the final effect is to display a specific interface on the screen, then the browser must convert each mark into an internal data structure, and this data structure is a DOM element. For example, an tag is an instance of the HTMLAnchorElement type in the browser's internal world.

An HTML file is like an article written in hypertext markup language. Articles usually have a structure, and in the eyes of the browser, it is DOM. DOM describes a series of hierarchical node trees. (But at this time, the DOM still existed inside the browser and was written in C++ language)

With the development of history, when people are no longer satisfied with simply displaying text, some text needs special emphasis or special text is added. The need for format slowly emerged. Faced with people's need to control the display effect, the first and simplest way to think of is to add markers. Add some style control tags. At this time, style control tags like and

appeared. But in this way, all marks will be divided into two categories: one tells what I am, and the other tells how I display. This is not a big problem, the markup is simple, but it is not so simple for the browser to parse the markup. Think about it, if you do this, the DOM will be divided into two categories, one is the DOM node that describes the element, and the other is the DOM node that describes the display effect. A DOM node may represent an element or a display effect. No matter how you look at it, it feels awkward.

In the end, people decided to abandon the style tag and add a style attribute to the element tag. The style attribute controls the style of the element (the original style declaration syntax must be very simple). The original properties of style tags have now become the syntax of style properties, and style tags have become style properties. This makes the logic much clearer. Then here comes the question:

If an article contains too much rhetoric, it will inevitably arouse readers’ disgust. If you put both elements and display effects in one file, it will definitely be difficult to read.
If there are 10 elements that all need an effect, do you have to write a style ten times?
Setting the effect of the parent element Does it have any impact on child elements? Let’s fight
. . . . . . . . .

There must be many similar problems, so CSS and cascading style sheets came out, which brought css rules, css selector, css declarations, css attributes, etc. , thus solving the above pain points. The markup language layer has been solved, but the browser can't just sit back and play, it must provide support. So when the browser parses a statichtml file, it traverses the entire html document to generate a DOM tree. When all style resources are loaded, the browser begins to build the rendering tree. The presentation tree determines how each DOM element should be drawn based on a series of CSS declarations and after cascading. At this time, no interface is actually displayed on the page, and the rendering tree is also a data structure in the browser memory. After the rendering tree is completed, the layout begins. This is like knowing the width and height of a rectangle. Now you need to measure where to draw it on the canvas and how much space it occupies. After this process is completed, it is the drawing process, and then we have the display interface we see.

The problem of adding some effects to the marks has been solved, and the wheel of history has begun to move forward again. Gradually, people are no longer satisfied with simple display effects, and people want some interaction. At that time, most of the people who wrote HTML did not understand software development. Are you kidding me? When I wrote the activity page, you asked me to use C++? What C++ does is indeed an anti-aircraft cannon to swat mosquitoes - overqualification and underutilization. Let the guerrillas do what the regular army disdains to do. At this time, Netscape developed the JavaScript language. JavaScript at that time was not as popular as it is now. A local script language was not as awesome as it is now to unify the universe.

JavaScript is a language that runs in the browser. HTML text is static. It is impossible for JavaScript to modify static files, but it can deal with the inside of the browser. But the DOM at this time is not today's DOM. They are C++objects. Either JavaScript is converted into C++ instructions to operate these C++ objects, or these C++ objects are packaged into JavaScript native objects. History chose the latter, and this time marked the official birth of modern DOM. However, history sometimes goes backwards, and there will always be a few weird things in history, such as IE. IE is weird and his whole family, including Edge!

Marx was a charlatan, but Engels was a good comrade. Dialectics of nature and historical materialism are good things. We can see this from a historical perspective. The ultimate source of the emergence and development of CSS, DOM, and JavaScript is HTML, Hypertext Markup Language. People's needs for the web ultimately converge on HTML. So whenever history creates new demands, the final changes will first occur in the HTML specification.

When interactivity cannot meet people's needs, the web ushered in a new demand: webapp. To cater to new needs, the first thing to change is the HTML specification. At this time, the existing HTML4.0 can no longer meet people's growing needs. Therefore, HTML5 is meeting the needs of history. After eight years of hard work, it was finally released in 2014. Officially finalized this year! HTML5 will definitely add new tags, but for traditional HTML, HTML5 is a rebellion. All previous versions only described the JavaScript interface in a few words, and the main space was used to define tags, and all JavaScript-related content was defined by the DOM specification. The HTML5 specification defines a large number of JavaScript API around how to use new tags (so some of the APIs overlap with DOM and define DOM extensions that browsers should support. From this we can see that HTML5 It is certainly not the final version of HTML).

The above is the detailed content of Learn what HTML5 is. For more information, please follow other related articles on the PHP Chinese website!