DW maintains a clear document structure

I fully support web standards and think that the document object model (dom, document object model) proposed by it is very reasonable and useful. The Document Object Model disconnects us from characters and operates documents in an advanced manner at the structure level.

In terms of web page creation (html/xhtml), following the web standards can make the website structure more reasonable. However, new standards will always lead to rejection by some old web page makers, which is simple because they cannot master new standards or/and they do not think they need new standards, the original method is enough. I will not discuss it with other people.

When standards were applied, some web page makers had entered some misunderstandings. The structure of documents is often confusing for a standard that is not good at and is insignificant. This clearly violates the original intention of web standards. Web standards allow us to organize documents in a clear structure, so that we can use dom to operate documents.

For example, the layout of three columns (usually three div labels) during the webpage creation process. Many web page creators use the nesting of three div labels to achieve the goal, because if not nested, when the window is reduced, the div label will flow down.

They are like this:

The code is as follows:	Copy code
<Div id = "column1"> <Div id = "column2"> <Div id = "column3"> </Div> </Div> </Div>

In terms of structure, content, and performance, these three columns are usually of equal status and should not be nested. Nesting implies their affiliated relationships. When we use xml parsing tools such as jdom, dom4j, or dom javascript (ecmascript) binding to parse these contents, we will encounter logical confusion.

Those who are biased against web standards may say that using table layout can easily achieve a good three-column layout. Let's look at the table code:

The code is as follows:	Copy code
<Table> <Tr> <Td id = "column1"> </td> <Td id = "column2"> </td> <Td id = "column3"> </td> </Tr> </Table>

It is possible that the table can easily achieve a three-column layout, but the code structure is the same as the above multi-layer nesting. <Table> and <tr> labels are redundant.

The correct method should be the following code:

The code is as follows:	Copy code
<Div id = "column1"> </Div> <Div id = "column2"> </Div> <Div id = "column3"> </Div>

In this way:

The code is as follows:	Copy code
<Div id = "subwrap"> <Div id = "content-main"> </Div> <Div id = "content-related"> </Div> </Div> <Div id = "content-extra"> </Div>

Because it thinks the third column is only extra (extra ). This layout can be viewed as a two-column layout in the code, and then the first column is divided into two columns, so it is displayed as three columns.