Document. compatmode

Today, I saw the document. compatmode attribute. I usually don't know much about the document mode, so I tested this attribute.

There are two types of document. compatmode values: "backcompat" and "css1compat ".

Backcompat indicates the standard compatibility mode is disabled.

Css1compat indicates that the standard compatibility mode is enabled.

The so-called standard compatibility mode is not enabled, that is, the "mixed mode" (also called the weird mode, quirks mode ).

The standard compatibility mode is "standard mode" (also called strict mode, standards mode or strict mode ).

HTML documents without doctype are rendered and parsed in a hybrid mode in all browsers.

Internet Explorer 6, which has the longest life In the IE series browser developed by Microsoft, was born with Windows XP. Compared with the previous version of ie5.5, IE6 does have many major improvements. The biggest change in page rendering is that IE6 supports some of the features in css1. For example, when you set the width and height for a block-level element, it does not apply to the border perimeter, but is described in W3C standards as only the element content. This is significantly different from ie5.5. To ensure that the pages developed based on IE6 in the later 1990s s can be displayed normally, that is, to ensure backward compatibility of the browser, this "switch" was born, microsoft tried to determine the mode in which the browser works by judging doctype, that is, IE6 or ie5.5. Therefore, we can see from the string values returned by document. compatmode that backcompat represents backward compatibility (IE). css1compat represents compatibility with css1 specifications (ie 6 ). As a result, the browser's working mode is divided into mixed mode and standard mode.

It is worth noting that the version number of IE has increased from 6.0 to 9.0, but the upgrade is limited to standard mode. For mixed mode, the version number of IE is permanently frozen at 5.5, which is a huge sacrifice for backward compatibility. That is to say, even if we use the latest and most advanced ie9, if we do not write doctype or use doctype that can trigger the mixed mode, the browser we face is still equivalent to ie5.5, an old antique that we used more than a decade ago. However, there is no such big difference in IE between the mixed mode and standard mode of other browsers.

The approximate standard mode is literally similar to the standard mode, but there is a small difference. It is mainly reflected in the differences in the vertical layout rendering of table cells. Beginning with IE8, Firefox, chrome, Safari, and opera 7.5, the standard modes of these browsers are more strictly compliant with the css2.1 specifications, therefore, the old standard model that is not "standard" is assigned the name of "approximate standard mode. However, in earlier versions of IE6 IE7 and earlier versions of opera 7.5, browsers cannot strictly follow the css2.1 specification, so they do not have this approximate standard mode, it can also be understood that their approximate standard mode is the standard mode.

So far, we can see that each browser has three modes.

Hybrid mode

Standard Mode

Approximate standard mode

Return to document. compatmode

When document. compatmode is

In backcompat mode, the width of the client area of the browser is document. Body. clientwidth.

Css1compat:The client width of the browser is document.doc umentelement. clientwidth.