IE的浏览器模式和文档模式

Posted 2020-07-29 Newbie_小白

 

只有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浏览器下去调试了，并且要分析代码的逻辑。