IE定義文檔兼容性
文檔兼容性可定義 Internet Explorer 呈現網頁的方式。 本文將介紹文檔兼容性、如何爲網頁指定文檔兼容性模式以及如何肯定網頁的文檔模式。javascript
爲了幫助確保您的網頁在未來的 Internet Explorer 版本中具備一致的外觀,Internet Explorer 8 引入了文檔兼容性。 文檔兼容性是對 Microsoft Internet Explorer 6 中引入的兼容性模式的擴展,使您能夠選擇 Internet Explorer 用於顯示網頁的特定呈現模式。html
本文將說明文檔兼容性的必要性,列出對近來的 Internet Explorer 版本可用的文檔兼容性模式,並演示如何選擇特定的兼容性模式。java
Internet Explorer 的每一個主要版本中都會添加一些功能,旨在使瀏覽器更易於使用、提升安全性以及更緊密地支持行業標準。 隨着 Internet Explorer 的功能不斷增長,將會出現較早的網站可能沒法正常顯示的風險。web
爲了最大程度地下降這種風險,Internet Explorer 6 容許 Web 開發人員選擇 Internet Explorer 用來解釋和顯示其網頁的方式。 默認爲「Quirks 模式」;在這種模式下,將按照使用較舊的瀏覽器版本查看網頁的方式來顯示網頁。 「標準模式」(也稱爲「嚴格模式」)的特色是可提供對行業標準的最大支持;可是,若要利用此加強的支持,網頁中須要包括適當的<!DOCTYPE> 指令。瀏覽器
若是某個站點未包括 <!DOCTYPE> 指令,則 Internet Explorer 6 將使用 Quirks 模式顯示該站點。 若是某個站點包含有瀏覽器未能識別的有效 <!DOCTYPE> 指令,則 Internet Explorer 6 將使用 Internet Explorer 6 標準模式顯示該站點。 因爲已經包含 <!DOCTYPE> 指令的站點不多,所以兼容性模式切換極爲成功。 這樣使 Web 開發人員可以選擇最佳時間將其站點遷移到標準模式。安全
隨着時間的推移,許多站點都開始依賴標準模式。 這些站點同時還開始使用 Internet Explorer 6 的功能和行爲來檢測 Internet Explorer。 例如,Internet Explorer 6 並不支持 通用選擇器(可能爲英文網頁);而某些網站將此用做爲 Internet Explorer 提供特定內容的方式。服務器
Internet Explorer 7 提供了通用選擇器支持等新功能,旨在更全面地支持行業標準。 因爲 <!DOCTYPE> 指令僅支持 Quirks 模式和標準模式這兩種設置,所以 Internet Explorer 7 標準模式替換了 Internet Explorer 6 標準模式。app
結果,依賴於 Internet Explorer 6 標準模式的行爲的站點(如缺少對通用選擇器的支持)將沒法檢測到新版本的瀏覽器。 所以,Internet Explorer 特定的內容不會提供給 Internet Explorer 7,而且這些站點不會按預期顯示。 因爲 Internet Explorer 7 僅支持兩種兼容性模式,所以將會迫使受影響站點的全部者更新其站點以支持 Internet Explorer 7。less
與任何早期瀏覽器版本相比,Internet Explorer 8 對行業標準提供了更加緊密的支持。 所以,針對舊版本的瀏覽器設計的站點可能不會按預期顯示。 爲了幫助減輕任何問題,Internet Explorer 8 引入了文檔兼容性的概念,從而容許您指定站點所支持的 Internet Explorer 版本。 文檔兼容性在 Internet Explorer 8 中添加了新的模式;這些模式將告訴瀏覽器如何解釋和呈現網站。 若是您的站點在 Internet Explorer 8 中沒法正確顯示,則能夠更新該站點以支持最新的 Web 標準(首選方式),也能夠強制 Internet Explorer 8 按照在舊版本的瀏覽器中查看站點的方式來顯示內容。 經過使用 meta 元素將 X-UA-Compatible 標頭添加到網頁中,能夠實現這一點。ide
這將容許您選擇什麼時候更新站點以支持由 Internet Explorer 8 支持的新功能。
Internet Explorer 8 支持不少文檔兼容性模式,這些模式啓用不一樣的功能並可影響內容的顯示方式。
「模仿 IE8」模式將告訴 Internet Explorer 使用 <!DOCTYPE> 指令來肯定如何呈現內容。 標準模式指令將以 Internet Explorer 8 標準模式顯示,而 Quirks 模式指令將以 IE5 模式顯示。 與 IE8 模式不一樣,「模仿 IE8」模式遵循 <!DOCTYPE> 指令。
「模仿 IE7」模式將告訴 Internet Explorer 使用 <!DOCTYPE> 指令來肯定如何呈現內容。 標準模式指令以 Internet Explorer 7 標準模式顯示,而 Quirks 模式指令以 IE5 模式顯示。 與 IE7 模式不一樣,「模仿 IE7 模式」遵循 <!DOCTYPE> 指令。 對於不少網站來講,這是首選的兼容性模式。
IE5 模式呈現內容的方式如同使用了 Internet Explorer 7 的 Quirks 模式來顯示內容,這與 Internet Explorer 5 顯示內容的方式很是類似。
不管頁面是否包含 <!DOCTYPE> 指令,IE7 模式呈現內容的方式均如同使用了 Internet Explorer 7 的標準模式來顯示內容。
IE8 模式可最大程度地支持行業標準(包括 W3C 級聯樣式表級別 2.1 規範(可能爲英文網頁) 和W3C 選擇器 API(可能爲英文網頁) ),並提供對 W3C 級聯樣式表級別 3 規範(工做草案)(可能爲英文網頁) 的有限支持。
Edge 模式將告訴 Internet Explorer 以可用的最高級別模式顯示內容。 對於 Internet Explorer 8,這等同於 IE8 模式。 假設 Internet Explorer 的未來版本支持更高級別的兼容性模式,那麼,設置爲 Edge 模式的頁面將以該版本支持的最高級別的模式顯示。 當使用 Internet Explorer 8 查看時,這些相同的頁面仍會以 IE8 模式顯示。
因爲 Edge 模式的文檔使用查看網頁所用的 Internet Explorer 版本可用的最高級別模式來顯示網頁,所以,建議僅將 Edge 模式用於測試頁面和其餘非生產活動。
若要爲網頁指定文檔模式,請使用 meta 元素,以在網頁中包含 X-UA-Compatible http-equiv 標頭。 如下示例指定「模仿 IE7」模式兼容性。
<html> <head> <!-- Mimic Internet Explorer 7 --> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" > <title>My Web Page</title> </head> <body> <p>Content goes here.</p> </body> </html> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" > <title>My Web Page</title> </head> <body> <p>Content goes here.</p> </body> </html>
content 屬性指定頁面的模式;若要模仿 Internet Explorer 7 的行爲,請指定「IE=EmulateIE7」。 指定「IE=5」、「IE=7」或「IE=8」可選擇相應的兼容性模式。 還能夠指定「IE=edge」以告訴 Internet Explorer 8 使用可用的最高級別模式。
X-UA-compatible 標頭不區分大小寫;不過,它必須顯示在網頁中除 title 元素和其餘 meta 元素之外的全部其餘元素以前的標頭(HEAD 節(可能爲英文網頁))中。
網站管理員能夠經過定義站點的自定義標頭,將其站點配置爲默認採用特定的文檔兼容性模式。 具體過程將依您的 Web 服務器而定。 例如,經過如下 web.config 文件,可讓 Microsoft Internet Information Services (IIS) 定義一個自定義標頭,以便自動按照 IE7 模式呈現全部頁面。
<?xml version="1.0" encoding="utf-8"?> <configuration> <system.webServer> <httpProtocol> <customHeaders> <clear /> <add name="X-UA-Compatible" value="IE=EmulateIE7" /> </customHeaders> </httpProtocol> </system.webServer> </configuration>
若是使用 Web 服務器指定了默認的文檔兼容性模式,則可經過在特定的網頁中指定不一樣的文檔兼容性模式來覆蓋默認設置。 在網頁中指定的模式優先於由 Web 服務器指定的模式。
有關如何指定自定義標頭的信息,請查看特定的 Web 服務器的文檔。 或者,訪問如下網頁以獲取詳細信息:
若要肯定使用 Internet Explorer 8 的網頁的文本兼容性模式,請使用 document 對象的 documentMode 屬性。 例如,將如下內容鍵入到 Windows Internet Explorer 8 的地址欄中,可顯示當前網頁的文檔模式。
javascript:alert(document.documentMode);
documentMode 屬性將返回一個與頁面的文檔兼容性模式相對應的數值。 例如,若是某個頁面已選擇支持 IE8 模式,則 documentMode 將返回值 8。
在 Internet Explorer 6 中引入的 compatMode 屬性已被棄用,取而代之的是在 Internet Explorer 8 中引入的 documentMode 屬性。當前依賴於 compatMode 的應用程序仍然能夠在 Internet Explorer 8 中運行;可是,應將這些應用程序更新爲使用 documentMode。
若是但願使用 JavaScript 來肯定文檔的兼容性模式,則應包含支持 Internet Explorer 舊版本的代碼,如如下示例中所示。
engine = null; if (window.navigator.appName == "Microsoft Internet Explorer") { // This is an IE browser. What mode is the engine in? if (document.documentMode) // IE8 engine = document.documentMode; else // IE 5-7 { engine = 5; // Assume quirks mode unless proven otherwise if (document.compatMode) { if (document.compatMode == "CSS1Compat") engine = 7; // standards mode } } // the engine variable now contains the document compatibility mode. }
content 屬性的使用很靈活,它能夠接受除前面所述的值以外的值。 這樣,您就可以更好地控制 Internet Explorer 顯示網頁的方式。 例如,能夠將 content 屬性設置爲 IE=7.5。 當您如此設置以後,Internet Explorer 會嘗試將該值轉換爲 版本矢量(可能爲英文網頁),並選擇與轉換結果最接近的模式。 在本例中,Internet Explorer 將會設置爲 IE7 模式。 如下示例顯示了爲其餘值選擇的模式(若是不存在其餘緩解因素)。
<meta http-equiv="X-UA-Compatible" content="IE=4"> <!-- IE5 mode --> <meta http-equiv="X-UA-Compatible" content="IE=7.5" > <!-- IE7 mode --> <meta http-equiv="X-UA-Compatible" content="IE=100" > <!-- IE8 mode --> <meta http-equiv="X-UA-Compatible" content="IE=a" > <!-- IE5 mode --> <!-- This header mimics Internet Explorer 7 and uses <!DOCTYPE> to determine how to display the Web page --> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" >
注意 上一個示例顯示了各個 content 值的結果。 實際上,Internet Explorer 僅遵循網頁中的第一個 X-UA-Compatible 標頭。
還可使用 content 屬性來指定多個文檔兼容性模式;這將有助於確保網頁在未來的瀏覽器版本中顯示一致。 若要指定多個文檔模式,應設置 content 屬性以標識要使用的各個模式。 各個模式之間使用分號分隔。
若是某個特定的 Internet Explorer 版本支持多個請求的兼容性模式,則該版本將使用標頭的 content 屬性中列出的可用的最高級別模式。 能夠利用這一原理來排除特定的兼容性模式,但不建議這樣作。 例如,下面的標頭排除了 IE7 模式。
<meta http-equiv="X-UA-Compatible" content="IE=5; IE=8" >
當 Internet Explorer 8 遇到未包含 X-UA-Compatible 標頭的網頁時,它將使用 <!DOCTYPE> 指令來肯定如何顯示該網頁。 若是該指令丟失或未指定基於標準的文檔類型,則 Internet Explorer 8 將以 IE5 模式(Quirks 模式)顯示該網頁。
若是 <!DOCTYPE> 指令指定了基於標準的文檔類型,則 Internet Explorer 8 將以 IE8 模式顯示該網頁,但出現如下狀況時除外:
爲該網頁啓用了兼容性視圖。
該網頁是在 Intranet 區域中加載的,而且已將 Internet Explorer 8 配置爲使用兼容性視圖來顯示 Intranet 區域中的網頁。
已將 Internet Explorer 8 配置爲使用兼容性視圖來顯示全部網站。
已將 Internet Explorer 8 配置爲使用兼容性視圖列表(其中指定了一組始終使用兼容性視圖顯示的網站)。
已使用開發人員工具覆蓋在該網頁中指定的設置。
該網頁遇到了頁面佈局錯誤,而且已將 Internet Explorer 8 配置爲,經過在兼容性視圖中從新打開網頁來自動今後類錯誤中恢復。
有關詳細信息,請參見 Internet Explorer 博客: 兼容性視圖概述(可能爲英文網頁) 。
注意 若是將 Internet Explorer 配置爲使用兼容性視圖加載 Intranet 頁面,Internet Explorer 將對使用 localhost 地址或 環回地址(可能爲英文網頁)加載的頁面引起異常。 若是 <!DOCTYPE> 指令指定基於標準的文檔類型,則將以 IE8 模式顯示使用這些技術加載的頁面。
此外,可使用下面的註冊表項來控制 Internet Explorer 對未包含 X-UA-Compatible 標頭的頁面的處理方式。
HKEY_LOCAL_MACHINE (or HKEY_CURRENT_USER)
SOFTWARE
Microsoft
Internet Explorer
Main
FeatureControl
FEATURE_BROWSER_EMULATION
iexplore.exe = (DWORD)
DWORD 值必須等於下列值之一。
值 | 說明 |
7000 | 包含基於標準的 <!DOCTYPE> 指令的頁面將以 IE7 模式顯示。 |
8000 | 包含基於標準的 <!DOCTYPE> 指令的頁面以 IE8 模式顯示。 |
8888 | 頁面始終以 IE8 模式顯示,而不考慮 <!DOCTYPE> 指令。 (這可繞過前面列出的例外狀況。) |
默認狀況下,承載 WebBrowser 控件(可能爲英文網頁)的應用程序將以 IE7 模式打開基於標準的頁面,除非頁面中包含適當的 X-UA-Compatible 標頭。 經過將應用程序可執行文件的名稱添加到 FEATURE_BROWSER_EMULATION 功能控制項中,並相應地設置值,能夠更改打開模式。
對於 Web 設計人員來講,兼容性是一個要考慮的重要問題。 儘管最好是建立不依賴於 Web 瀏覽器的特定行爲或功能的站點,但有時這樣作是不可能的。 文檔兼容性模式將網頁與 Internet Explorer 特定版本的行爲相關聯。
使用 X-UA-Compatible 標頭可指定頁面支持的 Internet Explorer 版本。 使用 document.documentMode 可肯定網頁的兼容性模式。
經過選擇支持特定的 Internet Explorer 版本,可有助於確保頁面在未來的瀏覽器版本中可以顯示一致。