IE11新文檔模式Edge介紹與評估,及在WebBrowser應用中的使用。


瀏覽器模式與文檔模式概念是怎么來的?

1.瀏覽器模式與文檔模式概念起源

為了解決兼容性的問題,在IE瀏覽器(IE8, IE9, IE10)中,引入了瀏覽器模式和文檔模式兩個概念,瀏覽網頁時可以通過按F12鍵看到這兩種模式。

2.瀏覽器模式的主要作用是為兼容較早版本的IE,它會控制瀏覽器發出的UserAgent,表示以哪個版本的瀏覽器發出請求,以此來允許為某個特定IE版本設計的代碼正確執行(舉例來說:有些代碼真是判斷ie版本的,還有css里也有判斷ie版本的)。

3.文檔模式的主要作用是影響瀏覽器顯示網頁HTML的方式,在接到返回的HTML文件后,決定以哪個IE版本的文檔模式解析該頁面(舉例來說:JS腳本就是依賴文檔模式,IE9的JS變化就需要IE9文檔模式來支持)。

 

怎么設置文檔模式

•1.使用 X-UA-Compatible 標頭可指定頁面支持的 IE 版本。

•2.使用 document.documentMode 可確定網頁的文檔模式。
•3.代碼示例:
    <html>
        <head>
            <title>abc</title>
            <META http-equiv="X-UA-Compatible" content="IE=9" > </META>
            <script type="text/javascript">
                function abc() { alert(document.documentMode); }  
            </script>          
        </head>
        <body onload="abc()"></body>
    </html>

 

IE11 Document mode changes

•Windows Internet Explorer 8 introduced document modes to help you transition from features supported by earlier versions of the browser to those specified by modern standards and other browsers. Subsequent releases of Windows Internet Explorer continued this transition by introducing new document modes that emulated features supported by earlier versions while introducing support for features defined by industry standards.
•While many web sites were updated to provide richer experiences to other browsers, some continued to use the presence of legacy feature support to provide legacy experiences to Internet Explorer, even though recent versions of the browser supported the experiences presented to other browsers.
•Starting with IE11, edge mode is the preferred document mode; it represents the highest support for modern standards available to the browser.
•Use the HTML5 document type declaration to enable edge mode: <!doctype html>
•Edge mode was introduced in Internet Explorer 8 and has been available in each subsequent release. Note that the features supported by edge mode are limited to those supported by the specific version of the browser rendering the content.
•Starting with IE11, document modes are deprecated and should no longer be used, except on a temporary basis. Make sure to update sites that rely on legacy features and document modes to reflect modern standards.
•If you must target a specific document mode so that your site functions while you rework it to support modern standards and features, be aware that you're using a transitional feature, one that may not be available in future versions.
•If you currently use the x-ua-compatible header to target a legacy document mode, it's possible your site won't reflect the best experience available with IE11.

 

文檔模式以及與IE11 的兼容性

•IE 11 中的兼容性改進可讓較早版本的網站以最新的標准模式運行,默認情況下,不需要模擬以前的瀏覽器行為。由於較早版本的網站現在能夠正常運行,因此我們已決定 IE 10 文檔模式將是最后一個新文檔模式。而開發人員需要轉變為使用 IE 11 中的 Edge 模式。也就是說,IE已經完成了標准化過渡,因此老模式就退出歷史舞台了,從IE11到以后的IE12, IE13…,邊緣模式成為首選文檔模式,都要用Edge了。它代表可供瀏覽器使用的現行標准的最高支持。

•如果決定仍然需要仿真某個以前的瀏覽器環境 IE 10 或更早版本,則可以更改服務器配置,將 X-UA-Compatible 元標記添加到 HTTP 標頭。更改此內容值可讓您的網站按所選的 IE 版本進行顯示。例如,如果希望內容像在 IE 10 中顯示的那樣,可在 X-UA-Compatible 元數據中指定值 IE=10。
 

X-UA-Compatible支持的值

 

內容值  

含義  

IE=5

使用   Internet   Explorer 5 Quirks 模式呈現內容。

IE=7

使用   Internet   Explorer 7 標准模式呈現內容。

IE=8

使用   Internet   Explorer 8 標准模式呈現內容。

IE=9

使用   Internet Explorer 9   標准模式呈現內容。

IE=10

使用   Internet   Explorer 10 標准模式呈現內容。

IE=Edge

使用最新模式呈現內容。建議所有網站都采用此模式。

 

注意:不要指定未來的內容值,如 IE=11 和更高版本。而應使用 IE=Edge 來獲取最新模式。也就是說,IE11時,我們要這樣用:

<META http-equiv="X-UA-Compatible" content="IE=Edge" > </META>

 

示例總結

•<!doctype html>是用來啟用Edge模式的一個方法,但是<!doctype html>這種方法,在WebBrowser應用中不起作用,還是被認為是Quirks模式 。

•X-UA-Compatible也是用來啟用Edge模式的一個方法,X-UA-Compatible這種方法,在瀏覽器及WebBrowser中都起作用,都有效。

•雖然寫IE=11也有同樣的效果,鑒於微軟不再建議這樣寫,所以我們應用標准的方法:<META http-equiv="X-UA-Compatible" content="IE=Edge" > </META>
 
本機IE11下使用WebBrower應用時的建議做法
•不使用企業模式,它在BancsLink這種WebBrowser應用中不可用,它在不使用網站而是直接打開磁盤上HTM頁面瀏覽時也不起作用。具體見上一帖: IE11企業模式介紹及可用性評估
•對於不使用IE11標准功能的HTM頁面,只要保持舊版本不做任何修改,文檔模式就會被認為是老版本的Quirks模式(版本號等於5,實際兼容IE5.5及IE6等),也就是說,不改就是用舊版本。
•對於要使用IE11標准功能HTM頁面,使用設置X-UA-Compatible的方式,但不要再指定版本號,如 IE=11 和更高版本,而使用 IE=Edge 來獲取最新模式。也就是要這樣用:
<META http-equiv="X-UA-Compatible" content="IE=Edge" > </META>
 
PDF下載:pdf
 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM