只有IE瀏覽器中才會有“瀏覽器模式”和“文檔模式”,兼容性視圖涉及兩個重要的功能 便是“瀏覽器模式【browser mode】”和“文檔模式【document mode】”,在IE8/IE9中按F12鍵,打開“開發人員工具”,在菜單欄中可以看到“瀏覽器模式”和“文檔模式”的切換菜單,其中可以選擇切換到 IE7/8等不同的網頁模式。這個設置之后在js中可以通過navigator.userAgent獲得瀏覽器的版本,這個一般情況是與瀏覽器模式對應 的,也可以通過Document.documentMode獲得瀏覽器的文檔模式,這個一般是與文檔模式相對應的。如果瀏覽器模式與文檔模式不一致的時 候,我們一般認為還是以文檔模式為准【渲染頁面】。
那“瀏覽器模式”和“文檔模式”之間有什么區別呢?
“瀏覽器模式”用於切換IE針對該網頁的默認文檔模式、對不同版本瀏覽器的條件備注解析、發送給網站服務器的用戶代理(User-Agent)字符串的 值。網站可以根據瀏覽器返回的不同用戶代理字符串判斷瀏覽器的版本和安裝的功能,這樣就可以向不同的瀏覽器返回不同的頁面內容。用開發人員工具切換瀏覽器 模式時,文檔模式也會對應改變。
默認情況下,IE8的瀏覽器模式為IE8。用戶可以通過單擊地址欄旁邊的兼容性視圖按鈕來手動切換到不同的瀏覽器模式。在IE8中,IE8兼容性視圖會以IE7文檔模式來顯示網頁,同時會向服務器發送IE7的用戶代理字符串。
“文檔模式”用於指定IE的頁面排版引擎(Trident)以哪個版本的方式來解析並渲染網頁代碼。切換文檔模式會導致網頁被刷新,但不會更改用戶代理字 符串中的版本號,也不會從服務器重新下載網頁。切換瀏覽器模式的同時,瀏覽器也會自動切換到相應的文檔模式。<meta http-equiv="x-ua-compatible" content="IE=7" />這個就是指定文檔模式為IE7,Trident會按照IE7模式去渲染頁面元素。
另外還有不同的,就是IE=7和IE=EmulateIE7,這兩個有什么不同呢?IE=7是頁面按照IE7去渲染,不考慮DocType,而IE=EmulateIE7是以兼容IE7的模式去渲染,考慮DocType。當然還有更例外的情況,就是真正的IE7與IE9下添加了<meta http-equiv="x-ua-compatible" content="IE=7" />也有不同的情況,前幾天做瀏覽器兼容的時候就碰到過,那個只能到IE7瀏覽器下去調試了,並且要分析代碼的邏輯。