IE (Part One) confusion about browser mode and text mode in the browser

What is browser mode and text mode?

Often use IE developer tools of the classmate, must have seen the browser mode and text mode, for these two nouns, comprehensive related documents explained as follows:

Browsermode, which is used to toggle the default text mode of IE for the page, parse the conditional comments on different versions of the browser, and determine the value of useragent in the request header. It has been determined before the browser makes a request, and the site has no way to modify the value. It represents the browser to which the user accesses the Web site. IE9 supports the following browser modes:

(The difference between theIE9 compatibility mode and the IE7 mode is that the former adds the Trident version to the UA, the latter and IE7 are fully consistent with no Trident logo; IE8compatibility mode corresponds to IE8 compatibility mode, UA Trident version is 4.0, the other has not changed. Also, there is no IE9 mode in IE8)

text mode, in fact, is often said document mode. Different text patterns correspond to different typesetting engines, different JS engines. As mentioned above, each browser mode corresponds to a default text pattern, and the site can also change the text pattern by some means, which represents the mode in which the browser renders the page. IE9 has the following text patterns:

(It should be explained that IE8 started to support the rendering mechanism: The quirks mode, the fully standard mode (standards mode) and the approximate standard mode (almost standards mode), but the developer tool is unable to select the approximate standard mode, In fact, we generally choose to trigger the full standard mode.

What is the use of browser mode and text mode?

Used to solve the compatibility problems caused by the versions of IE. According to Microsoft's description of the IE compatibility policy, access to a page in ie8+ to go through such a process:

First, the browser to determine the browser mode. As stated above, the browser mode must be determined before the request is sent, the default is the latest (IE9 is the IE9 standard , IE8 is the IE8 standard ), there are two ways to change it:

• Choose from developer tools (see table above for options);
• By clicking the Compatibility View button;
• Hit Compatibility View list (Microsoft maintains a list of compatibility views that need to be used.) ie8+ default to this list and the local area network URL will adopt the corresponding compatibility mode);

Second, the browser through the request header useragent value, tells the server is currently what browser mode;

Third, the server can change the browser text mode in the following way:

• DocType
• x-ua-compatible Meta or corresponding response head;

Iv. the browser takes into account the developer tool settings, the settings returned by the third-step server, the Compatibility List settings, and so on, deciding what text mode to use for the page. This process is a bit complicated, put a qwrap group in the ash provided by the flow chart, you can open your own to see the big picture.

(It is IE9 to select the text mode of the flowchart, there is also the IE8 version, there are some differences)

The problem is finally coming!

Review the previous introduction, the browser mode determines: 1) The default text mode sent to the server ua;2), 3) How to parse the conditional comment. It is determined before the request is sent and is not controlled by the server. Text mode decision: 1) typesetting engine; 2) JS engine. It is finalized after the browser responds, and the server can be controlled by DOCTYPE or x-ua-compatible.

test One , based on the previous article, if the user browser does not activate the compatibility view, the IE developer tool is not turned on. Then IE9 browser mode defaults to IE9, the default corresponding text pattern should be IE9 standard (for IE8, is similar), we use the following code to change it to the IE7 standard :

<meta http-equiv= "x-ua-compatible" content= "ie=7" >

Below, we test this page with native IE8, IE9, respectively:

The table above shows that when the browser sends the request the browser mode is expected (according to the request header UA), x-ua-compatible does change the browser text mode to the IE7 standard (according to the Documentmode and JS engine). Strangely, the change in the text pattern led to a change in the browser mode, because conditional annotations are determined by the browser mode. In this example, the text pattern is changed to the IE7 standard , and the conditional annotation becomes IE7, which means that the browser mode changes to IE9/IE8 compatibility (from the IE9 test, it cannot be IE7, Because UA contains Trident). As to why the UA in IE8 has not changed, it could be a bug or an understanding inconsistency.

Test Two , what if I add the test address to the compatibility list? According to the previous article, the browser mode should be IE9/IE8 compatibility , the corresponding text mode is still the IE7 standard . The test results are as follows:

The table above is exactly as expected.

Test Three , if you change the x-ua-compatible to Ie=edge, continue to use the compatibility mode test it? The conclusions are as follows:

This conclusion is in fact consistent with the test: X-ua-compatible is Ie=edge, which means that the text pattern will use the latest available version, but the change in the text mode changes the browser mode from ie9/ie8 compatibility to IE9/IE8 . IE9 will follow the new browser mode to set JS NAVIGATOR.USERAGENT,IE8 the UA unchanged.

Test Four , what if the browser mode and text mode are set manually by the developer tools? After testing, this test is expected to be consistent. For example IE9, set the browser mode to IE8, the text mode is IE7 standard , the request header UA, JS UA, conditional comments all indicate that the browser mode is IE8, Both the Documentmode and JS engines indicate that the text pattern is the IE7 standard . Because, IE developer tools have the highest priority, set this, all the other conditions are ignored!

Conclusion

Changes in x-ua-compatible to text patterns in IE8/9 will cause changes in the browser mode, which means that the server can indirectly control the browser mode. This is not the same as the description in the Microsoft Documentation:

An important detail to remember is the Browser Mode is chosen before IE requests Web content. This means, sites cannot choose a Browser Mode.

For IE8, if the Web site changes the text mode to a value other than the default text mode of the current browser mode through X-ua-compatible Meta/header, then the page will be rendered according to the new text pattern, and the conditional annotation is parsed according to the browser mode corresponding to the new text pattern. But the UA obtained by JS is the initial state of the browser mode. This results in a browser version of the UA obtained with JS, which is inconsistent with the actual rendered browser version, which interferes with the UA-based browser detection.

For IE9, only one point is different from IE8: JS gets the UA of the browser mode corresponding to the new text pattern. This results in a browser version of the UA obtained with JS, which is inconsistent with the version of the browser requested by the server UA, which may have an impact on statistics.

For IE this compatibility scheme, it is almost impossible to achieve theoretical perfection. Personal feeling or IE9 strategy has a smaller, better impact.

PS, the above conclusions are my own test with native IE9 of Windows XP native Ie8,windows 7. For the domestic those ie shell, is really too wonderful, not within the scope of this article.

Source: https://www.imququ.com/post/browser-mode-and-document-mode-in-ie.html

IE (Part One) confusion about browser mode and text mode in the browser