什么是Doctype 什么是标准模式与混杂模式?
一、什么是Doctype?
DOCTYPE是Document Type(文档类型)的简写,在页面中,用来指定页面所使用的XHTML(或者HTML)的版本。要想制作符合标准的页面,一个必不可少的关键组成部分就是DOCTYPE声明。只有确定了一个正确的DOCTYPE,XHTML里的标识和CSS才能正常生效。
以XHTML 1.0为例:
XHTML 1.0中有3种DTD(文档类型定义)声明可以选择:过渡的(Transitional)、严格的(Strict)和框架的(Frameset)。这里分别介绍如下。
1.过渡的
一种要求不很严格的DTD,允许在页面中使用HTML4.01的标识(符合xhtml语法标准)。过渡的DTD的写法如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.严格的
一种要求严格的DTD,不允许使用任何表现层的标识和属性,例如<br/>等。严格的DTD的写法如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "/TR/xhtml1/DTD/xhtml1-strict.dtd">
3.框架的
一种专门针对框架页面所使用的DTD,当页面中含有框架元素时,就要采用这种DTD。框架的DTD的写法如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-frameset.dtd">
ps:
使用严格的DTD来制作页面,当然是最理想的方式。但是,对于没有深入了解Web标准的网页设计者,比较合适的是使用过渡的DTD。因为这种DTD还允许使用表现层的标识、元素和属性,比较适合大多数网页制作人员。
二、什么是标准模式与混杂模式?
不同文档模式主要影响CSS内容的呈现,尤其是浏览器对盒模型的解析,但在某些情况下也会影响到JavaScript的解释执行。
1、文档模式目前有四种:
混杂模式(quirks mode)
//让IE的行为与(包含非标准特性的)IE5相同
标准模式(standards mode)
//让IE的行为更接近标准行为
准标准模式(almost standards mode)
//这种模式下的浏览器特性有很多都是符合标准的,不标准的地方主要体现在处理图片间隙的时候(在表格中使用图片时问题最明显)。
超级标准模式:
//IE8引入的一种新的文档模式,超级文档模式可以让IE以其所有版本中最符合标准的方式来解释网页内容。
ps:
总的来看,混杂模式让IE像IE5,标准模式使用IE7的呈现引擎,而超级标准模式则是IE8的默认文档模式。
2、如何触发文档模式:
§ 触发混杂模式:
如果在文档开始处没有发现文档类型声明,则所有浏览器都会默认开启混杂模式。但采用混杂模式不是什么值得推荐的做法,因为不同浏览器在这种模式下的行为差异非常大,如果不使用某些hack技术,跨浏览器的行为根本就没有一致性可言。
§ 触发标准模式:
§ 
§ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "/TR/html4/strict.dtd">
§
§ 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "/TR/xhtml1/DTD/xhtml1-strict.dtd">
§ 触发准标准模式:
§ 
§ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd">
§
§ 
§ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "/TR/html4/frameset.dtd">
§
§ 
§ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">
§
§ 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "/TR/xhtml1/DTD/xhtml1-frameset.dtd">
§ IE8中关闭超级标准模式:
§ <meta http-equiv="X-UA-Compatible" content="IE=7" />
//content属性中IE的值用于指定使用哪个版本的呈现引擎来呈现页面。设计这个值的目的就是为了向后兼容那些专门为老版本的IE设计的站点和页面。
IE 版本实在太多了,而且每个版本又变化很大,出到 IE9 连微软都开始担心开发者能否搞定,于是就有了这篇官方博文,详细介绍了自 IE8 起引入的兼容性解决方案:
Testing sites with Browser Mode vs. Doc Mode
浏览器模式
 
不受程序员控制,用户可以自由选择合适的ie版本,影响了以下三个方面:
1.发送给服务器合适的UA
2.控制页面中的条件注释 。(条件注释依赖于 UA 串) 
3.对应了默认的文本模式(渲染模式,IE8 引入document.Mode)。
关于默认对应关系可见:
 
updated 2010-10-24
 
ie UA 判断需要考虑渲染引擎版本 trident
 
兼容模式和其他模式的区别在于,兼容模式会在UA中表示自己是 MSie7 但是同时也会表示自己的渲染引擎是trident 5.0,如下:
 
Js代码
1. Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Trident/5.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727) 
Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Trident/5.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727)
 
getattribute方法返回类型但是选择ie7模式时,则会完全丢弃掉trident版本:
 
Js代码
1. Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322; .NET CLR 2.0.50727) 
Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322; .NET CLR 2.0.50727)
 
一般来说,终端用户可选择兼容模式(地址栏兼容按钮),但是开发者通过 trident 仍然可以知道真正的浏览器版本,其他模式主要用于程序员调试(程序完全不知),终端用户如果选择后果自负!
比如一个 ie9 问题,当程序设置 document mode 处于 ie9 时,透明度 filter 设置会失效即透明失效,即使设置了opacity,这是就可以根据trident来判断,无论是 MSIE7.0 (兼容模式)还是 MSIE9.0(ie9模式) [具体哪种模式受微软白名单控制以及用户选择],都把filter去掉,具体方法则是初始化时在页面body上加入class:tridentxx,在样式中写明:
 
Html代码
1. <body class='trident5'> 
2.  
3. .trident5 xx{   
4.   filter:none;   
5.
<body class='trident5'>
.trident5 xx{
  filter:none;
}
 
 
文本模式
 
直接和界面显示相关,用来指示选择具体的渲染引擎,例如 ie8 标准模式下不支持 css表达式。脚本可以通过 document.documentMode  探测。
updated 2010-11-10 
 
当切换 document.documentMode ,不仅会切换渲染引擎,而且会切换 js 引擎,可在切换前后分别执行以下程序测试:
 
Js代码
1. typeof&ate 
ate
 
 
 
可以通过以下方面由程序员控制
1. 页面中的 DOCTYPE 属性。
需要注意的是:实际上从 ie8 起存在 3 种渲染机制,目前推荐 <!DOCTYPE html>触发完全标准模式。
其他详见:Quirks mode、Almost standards mode、Standards mode
2. X-UA-Compatible Meta tag
可以在 head 开头 插入 meta 标签:
 
Html代码 
1. <meta http-equiv="X-UA-Compatible" content="IE=mode" > 
<meta http-equiv="X-UA-Compatible" content="IE=mode" >
 
mode 取值结合 1 DOCTYPE 会直接影响到使用哪个渲染引擎:
 
更详细的见这里:how-ie8-determines-document-mode
 
3. HTTP Header
同2,不过直接操作 http 协议头,需要注意的是 2 的优先级比 3 高。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。