IE8兼容視圖(IE7 mode)與獨立IE7的區別


一.           IE8兼容視圖概述

為了解決新版瀏覽器不兼容舊網站的問題,IE8瀏覽器增加了一種叫做“兼容性視圖”的功能,可以讓網頁以IE7的代碼規范來顯示,這樣,就能夠很好的解決大部分(但不是全部)由於代碼標准不一致引起的網頁問題。

 

二.“瀏覽器模式”和“文檔模式”之間的區別

兼容性視圖涉及兩個重要的功能便是“瀏覽器模式browser mode”和“文檔模式document mode”,在IE8中按F12鍵,打開“開發人員工具”,在菜單欄中可以看到“瀏覽器模式”和“文檔模式”的切換菜單,其中可以選擇切換到IE7/8等不同的網頁模式。

 

那“瀏覽器模式”和“文檔模式”之間有什么區別呢?

 

“瀏覽器模式”用於切換IE針對該網頁的默認文檔模式、對不同版本瀏覽器的條件備注解析、發送給網站服務器的用戶代理(User-Agent)字符串的值。網站可以根據瀏覽器返回的不同用戶代理字符串判斷瀏覽器的版本和安裝的功能,這樣就可以向不同的瀏覽器返回不同的頁面內容。

 

默認情況下,IE8的瀏覽器模式為IE8。用戶可以通過單擊地址欄旁邊的兼容性視圖按鈕來手動切換到不同的瀏覽器模式。在IE8中,IE8兼容性視圖會以IE7文檔模式來顯示網頁,同時會向服務器發送IE7的用戶代理字符串。

 

“文檔模式”用於指定IE的頁面排版引擎(Trident)以哪個版本的方式來解析並渲染網頁代碼。切換文檔模式會導致網頁被刷新,但不會更改用戶代理字符串中的版本號,也不會從服務器重新下載網頁。切換瀏覽器模式的同時,瀏覽器也會自動切換到相應的文檔模式。

 

一般來說,兩者都要設置為同樣的版本,但是,如果不同又如何呢?或者說兩者是否有優先級區別呢?

 

請看下面的msdn帖子:Just The Facts: Recap of Compatibility View

http://blogs.msdn.com/b/ie/archive/2009/02/16/just-the-facts-recap-of-compatibility-view.aspx

精華摘抄:

We’ve evangelized use of the X-UA-Compatible tag to websites unable to update to support IE8’s Standards mode. The tag allows a web author to declare the exact standards mode behavior for which their website works best – IE8 Standards (again, the default when no header is present) or IE7 Standards. For example, using the value ‘IE=EmulateIE7’ causes IE8 to display a website “as IE7 would have”.

We’ve provided end-user and corporate / IT mitigations to the website compatibility problem under the umbrella term ‘Compatibility View’. ‘Compatibility View’ allows IE8 users to have a great experience even when visiting websites that haven’t yet performed either of the above two steps. It also helps IT organizations preserve compatibility with the large number of line-of-business websites that are Internet Explorer 7 capable today.

Compatibility View and the X-UA-Compatible tag are not equivalent. Compatibility View is something you do on the client. It affects three things: the User Agent string, the Version Vector (used in evaluation of conditional comments), and what mode DOCTYPEs that trigger Standards map to – IE8 Standards or IE7 Standards. The X-UA-Compatible <META> tag / header is something you use in page content / server-side and, when present, completely overrides Compatibility View settings on the client. It affects two things: the Version Vector and what mode DOCTYPEs that trigger Standards map to. It can’t affect the UA string as it’s already too late to change that – the client’s already made the GET request to the server (and it contains a UA string). What this means to developers is that if your site pivots on the User Agent string, adding just the X-UA-Compatible tag (to cause IE8 to display your site in IE7 Standards mode) won’t make your website compatible – you’ll also need to update your User Agent string detection logic as well.

總結,有兩種方式可以使IE8兼容IE7模式,一是在服務器端,通過程序員控制修改網頁的文檔模式document mode,也就是通過MetaX-UA-Compatible IE=EmulateIE7, 強制使頁面變為兼容IE7的頁面。

如下:

<head runat="server">

    <meta http-equiv="X-UA-Compatible" content="IE=7" />

    <title>cest</title>

</head>

如果不寫這句,就會默認使用IE8了。

 

另一個就是在客戶端,當網站還沒來得及修改Meta時,用戶如果裝了IE8,發現無法正常顯示,這時最后一招就是點擊Compatibility View按鈕了,它最終體現在User Agent上,也就是說點了兼容性視圖按鈕,再提交的Http請求頭就被改寫為 MSIE7.0,使客戶端偽裝成IE7來發送請求。

 

如下:

User-Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; Trident/5.0; SLCC1; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; .NET4.0C; .NET4.0E)

 

按照該MSDN的說法,修改MetaX-UA-Compatible IE=EmulateIE7)的優先級要高於點擊Compatibility View,它可以覆蓋掉Compatibility View的選擇, 也就是說,一旦網站改版完成發布后,只要設置了Meta , 就可以使原來用戶瀏覽器上設置的Compatibility View作廢,從而自動適應新版本的IE8瀏覽器。

 

三.IE8兼容視圖(IE7 mode)與獨立IE7不完全相同

請看Technet.Microsoft的帖子:

 

What Is Compatibility View?

http://technet.microsoft.com/zh-cn/ff966533

 

Compatibility View is a feature of Windows Internet Explorer 8 that enables the browser to render a webpage nearly identically to the way that Windows Internet Explorer 7 would render it.

 

In Internet Explorer 8, Compatibility View changes how the browser interprets code that is written in CSS, HTML, and the Document Object Model (DOM) to try to match Internet Explorer 7. A site that a user views in Internet Explorer 8 Compatibility View is almost identical to a site that the user views in Internet Explorer 7. However, Compatibility View does not change how the browser interprets all code. For example, the changes in Internet Explorer 8 for how the browser handles ActiveX, the parser, AJAX, JavaScript, networking, and security might still cause compatibility issues. Compatibility View does not change these behaviors.

 

In an enterprise environment, some areas have lower risk for compatibility issues. For example, Intranet Zone websites use Compatibility View by default. Client web applications that render by using the Web Browser Control, or the WebOC (Internet Explorer rendering engine), also have a low risk for compatibility issues because Internet Explorer 8 defaults to a compatibility mode for the WebOC. However, the default configuration settings for Compatibility View might not ensure complete compatibility. To determine if a website or web application is compatible with Internet Explorer 8, you should test the website or web application.

 

For more information about the differences between Internet Explorer 8 Compatibility View and Internet Explorer 7, see the Site Compatibility and Internet Explorer 8 blog. For a list of what to check when you upgrade to Internet Explorer 8, see the Internet Explorer 8 Readiness Toolkit.

 

For more information about Compatibility View, see the Internet Explorer Team Blog.

 

請看MSDN的帖子:

1.      Differences between IE8 Compatibility View and IE7

http://blogs.msdn.com/b/ie/archive/2009/03/12/site-compatibility-and-ie8.aspx

摘抄:

We strive to make Compatibility View behave as much like IE7 as possible, but we do make exceptions. Many of these exceptions enable improved security and accessibility features immediately, even for sites that have not yet migrated to IE8 Standards Mode.

 

2.      What EXACTLY does Compatibility View do in IE8?

http://webmasters.stackexchange.com/questions/2219/what-exactly-does-compatibility-view-do-in-ie8

精華摘抄:

Compatibility View renders the page as if it was Internet Explorer 7 (including Javascript). There are a few differences between IE8 with CV and pure IE7 but essentially it is the same. If you really want the detail of what is going on then read Just The Facts: Recap of Compatibility View from the IE MSDN blog.


You can also force IE8 to use CV with this meta tag:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

If you are having problems, I'd suggest first checking you have a legitimate doctype in your HTML (the simplest one is <!DOCTYPE html> which forces standards mode). That will solve 90% of your problems, especially with IE6.

 

結論是:IE8兼容模式與獨立的IE7是不同的,還是有些差異的,它並不是在IE8里簡單包含了一個完整的IE7

 

四.具體差異的細節

 

1.      Cross Document Communication

Hacks enabling cross-domain, cross-document communication have been disabled for security reasons. 

 

解決方案:Use Cross Document Messaging (XDM) to work around this change.

 

2.      Extending the Event Object

IE exposes new properties for certain AJAX features such as Cross Document Messaging (XDM), even in Compatibility View. Adding custom properties to the Event object can conflict with these new properties, such as "source".

event.source = myObject; // Read-only in IE8

 

解決方案: Change the names of conflicting custom properties to avoid collision.

event.mySource = myObject;

 

3.      Attribute Ordering

The ordering of attributes has changed, affecting the attributes collection as well as the values of innerHTML and outerHTML. Pages depending on a specific attribute ordering may break. 

attr = elm.attributes[1]; // May differ in IE8

 

解決方案: Reference attributes by name as opposed to their position within the attributes collection.

attr = elm.attributes["id"];

 

4.      Setting Unsupported CSS Values

Assigning CSS values that were unsupported in IE7 but are supported in IE8 Standards Mode will not generate exceptions in IE8 Compatibility View. Some sites use these exceptions to determine if a particular value for a CSS property is supported or not.

 

Try

{

elm.style.display = "table-cell";

} catch(e)

{

// This executes in IE7,

// but not IE8, regardless of mode

}

 

解決方案: Short of version detection, this is a difficult issue to work around. If this behavior is essential to a page, updating the page to run in IE8 Standards Mode may be the best approach.


免責聲明!

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



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