【IE】浏览器模式与文档模式 及其开发中处理方式

原文:http://blog.csdn.net/neo_liu0000/article/details/7589731

什么是浏览器模式和文本模式?

经常使用IE开发者工具的同学,肯定见过浏览器模式和文本模式,对于这两个名词,综合相关文档解释如下:

浏览器模式(Browser Mode),用于切换IE针对该网页的默认文本模式、对不同版本浏览器的条件注释解析、决定请求头里userAgent的值。它在浏览器发出请求之前就已经确定,网站没有办法修改这个值。它代表的是用户以何种浏览器访问网站。

文本模式(Document Mode),其实就是经常说的文档模式。不同的文本模式对应不同的排版引擎,不同的JS引擎。上面提到,每一种浏览器模式对应一种默认的文本模式,网站还可以通过一些手段来更改文本模式,它代表的是浏览器以何种模式呈现页面。

浏览器模式和文本模式有什么用?

用来解决IE各版本带来的兼容性问题。根据微软描述的IE兼容性策略,在IE8+访问一个页面要经过这样的流程:

一、首先,浏览器要确定浏览器模式。上面说过,浏览器模式是在请求发送之前就必须确定,默认取最新(IE9为IE9标准,IE8为IE8标准),有两种方式可以更改它:

  • 通过开发者工具选择(可选项见上表);
  • 通过点击兼容性视图按钮;
  • 命中兼容性视图列表(微软维护的需要采用兼容性视图的列表。IE8+默认对这个列表和局域网的网址都会采用相应的兼容性模式);

二、浏览器通过请求头里userAgent的值,告诉服务器当前是何种浏览器模式;

三、服务器可以通过下面方式改变浏览器文本模式:

  • doctype;
  • X-UA-Compatible Meta或对应的响应头

浏览器模式决定:1)发送给服务端的UA;2)默认的文本模式;3)如何解析条件注释。它在请求发送前就已经确定,且不受服务端控制。文本模式决 定:1)排版引擎;2)JS引擎。它在浏览器得到响应后最终确定,服务端可通过doctype或X-UA-Compatible来控制。

测试一、根据前文,如果用户浏览器没有激活兼容性视图;没有开启IE开发者工具。那么IE9的浏览器模式默认为IE9,默认对应的文本模式应该是IE9标准(对于IE8来说,是类似的),我们通过下列代码将它改到IE7标准

?

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

测试二、那如果把测试地址加到兼容性列表呢?根据前文,这种情况浏览器模式应该是IE9/IE8兼容性,对应的文本模式依然是IE7标准

测试三、如果把X-UA-Compatible改成IE=edge,继续使用兼容性模式测试呢?

这个结论其实跟测试一是一致的:X-UA-Compatible为IE=edge,意味着文本模式会使用最新可用的版本,然而文本模式的更改,又把浏览器模式从IE9/IE8兼容性变成IE9/IE8。IE9会按照新的浏览器模式来设置JS的navigator.userAgent,IE8下JS的UA不变。

测试四、那如果通过开发者工具人为设置浏览器模式和文本模式呢?经过测试,这样测试都是符合预期的。例如IE9下,设置浏览器模式为IE8,文本模式为IE7标准,请求头UA、JS的UA、条件注释都表明浏览器模式是IE8,documentMode和JS引擎都表明文本模式是IE7标准。因为,IE开发者工具的优先级最高,设置了这个,其他条件统统无视!

结论

IE8/9中X-UA-Compatible对文本模式的改变会导致浏览器模式的改变,也就是说服务端可以间接控制浏览器模式。

时间: 2024-12-27 19:34:31

【IE】浏览器模式与文档模式 及其开发中处理方式的相关文章

ie浏览器f12下调“浏览器模式”和“文档模式”的区别

废话不多说了,进入正题 一,浏览器模式 “浏览器模式”用于切换IE针对该网页的默认文档模式.对不同版本浏览器的条件备注解析.发送给网站服务器的用户代理(User-Agent)字符串的值.网站可以根据浏览器返回的不同用户代理字符串判断浏览器的版本和安装的功能,这样就可以向不同的浏览器返回不同的页面内容. 二,文档模式 “文档模式”用于指定IE的页面排版引擎(Trident)以哪个版本的方式来解析并渲染网页代码.切换文档模式会导致网页被刷新,但不会更改用户代理字符串中的版本号,也不会从服务器重新下载

文档模式与IE浏览器模式

一.IE浏览器的兼容性视图 兼容性视图是微软为了兼容基于其它网页标准开发的网站,确保广大互联网用户在浏览网页时不至于受困于网页显示混乱的问题,而专门为IE8增加的一项实用功能.当IE8检测到某网站不兼容时,地址栏右侧就会出现兼容性视图按钮,只需轻轻一点,大部分网页显示就会正常了.(网页会以IE7的代码规范来显示) 它引入重要的两个概念便是“浏览器模式”和“文档模式”: 注:也可按F12进入开发人员工具来查看当前页面的浏览器模式和文档模式 二.文档模式 指定IE页面排版引擎根据哪一个版本的方式来解

JS魔法堂:精确判断IE的文档模式by特征嗅探

一.前言 苦逼的前端攻城狮都深受浏览器兼容之苦,再完成每一项功能前都要左顾右盼,生怕浏览器不支持某个API,生怕原生API内含臭虫因此判断浏览器类型和版本号成了不可绕过的一道关卡,而特征嗅探是继浏览器探测后另一利器处理上述问题. 二.何为特征嗅探 从前我们都是通过对navigator.userAgent或navigator.appName两个属性值进行特定字符串匹配和萃取来区分浏览器类型和获取版本号的.但随着IE8提供可选的文档兼容性模式设置和各种加壳浏览器的出现,导致无法通过navigator

X-UA-Compatible IE 浏览器默认文档模式设置

制作网页的时候,IE8浏览器浏览页面的时候,有时候文档模式默认是IE7,导致IE8兼容性不是非常好.出现IE7应该出现的模式. 解决的方法例如以下: 在X-UA-Compatible中可用的方法有: <meta http-equiv="X-UA-Compatible" content="IE=5" > <meta http-equiv="X-UA-Compatible" content="IE=7" >

360浏览器遇到文档模式是IE7的解决办法

这段时间遇到了360浏览器在加载java项目时,默认的文档模式是IE7,使得网页加载下拉框出现问题. 解决的方法是: 在显示的jsp页面加上 <meta http-equiv="X-UA-Compatible" content="IE=edge"> <head> <title></title> <meta http-equiv="X-UA-Compatible" content="I

html中设置默认的浏览器文档模式

<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><TITLE>${systemConfig.getStringConfigValue("webtitle")}——登陆</TITLE><meta name="description" content=""

如何使浏览器打开时,默认的文档模式就是标准模式

请看下方: 第一步,将代码设置成html5的模式,那么用户打开项目之后,文档模式就是标准的:即不会是ie5Qurik模式:但有可能是ie7标准模式: 第二步, 2.1 在html head中写上这句代码,即可时文档模式为你浏览器最高级别的模式:<meta http-equiv="X-UA-Compatible" content="IE=edge" />: 2.2 若你想已ie8的标准模式打开,就写成<meta http-equiv=X-UA-Com

【实战问题】【10】IE浏览器兼容问题,发布后变成了(浏览器IE9兼容模式,文档IE7标准模式)

起因: 近期发生一件特别无语的事,我写的程序在本地运行的时候在IE浏览器打开是IE9标准模式,发布到服务器之后再在IE浏览器打开,就变成了兼容模式,一步步改好之后在图片上传那里又卡了好久,最后都改好了之后,发现了问题所在,我的问题可能不适用于所有情况,仅给大家参考一下 我的问题很简单:我用了lanternFQ,关了就好了 过程: 1,所有和ajax这种格式的一样的,最后一项(此处为success)都不要加逗号(,). $.ajax({ type : "POST", url : &quo

1关于script标签属性,注意点,浏览器文档模式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>    <title></title></h