关于渲染模式：

在多年以前（IE6诞生以前），各浏览器都处于各自比较封闭的发展中（基本没有兼容性可谈）。随着WEB的发展，兼容性问题的解决越来

越显得迫切，随即，各浏览器厂商发布了按照标准模式（遵循各厂商制定的统一标准）工作的浏览器，比如IE6就是其中之一。但是考虑到以

前建设的网站并不支持标准模式，所以各浏览器在加入标准模式的同时也保留了混杂模式（即以前那种未按照统一标准工作的模式，也叫怪

异模式）。经过多年的发展，后来又出现了近似标准模式（在一种模式中同时融入标准模式和部分混杂模式的特性，也称为接近标准模式、

准标准模式、最有限混杂模式）和超级标准模式（近似标准模式、标准模式、超级标准模式三者也共同被称作标准模式）。因此，浏览器的

模式可以分为两类：标准模式和混杂模式，其中，标准模式又可更严格的分为近似标准模式、标准模式、超级标准模式。

需要注意的是，不同厂商浏览器的标准模式也是有细微差别的（这是标准实现程度的问题）。此外，同品牌不同版本浏览器的标准模式也是

有差别的，比如IE6&IE7时代的标准模式在现在看来或许已经不那么标准了（IE8和IE9都在不断的提高标准的实现程度，因此差距越来越大是

必然的），但尽管如此它们依然叫做标准模式，毕竟它们在那个特定时代那个特定版本中确实是按照尽可能遵循标准的方式工作的。

什么是DOCTYPE：

DOCTYPE，或者称为 Document Type Declaration（文档类型声明，缩写 DTD）。通常情况下，DOCTYPE 位于一个 HTML 文档的最前面的

位置，位于根元素 HTML 的起始标签之前。这样一来，在浏览器解析 HTML 文档正文之前就可以确定当前文档的类型，以决定其需要采用的

渲染模式（不同的渲染模式会影响到浏览器对于 CSS 代码甚至 JavaScript 脚本的解析）。

DOCTYPE与各种模式的关系：

混杂模式：

不写DOCTYPE

近似标准模式：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

标准模式：

<!DOCTYPE html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

我们可以看到，过渡型或框架型HTML声明与过渡型或框架型XHTML声明均可使浏览器进入近似标准模式，同时，html5的DOCTYPE声明和严

格型HTML声明以及严格型XHTML声明则会使浏览器进入标准模式。

三种模式下的表现差异：

首先，混杂模式是不可取的，因为其没有兼容性可言。在IE（IE6~IE9）中，混杂模式即使用IE5.5内核来解析并渲染页面。其次，近似标准

模式是在尽可能遵循标准的基础上兼容部分非标准代码，比如一些已经弃用的标签等。标准模式则是对统一标准实现最好的模式，它要求标

签必须闭合（唯一不需要闭合的就是DOCTYPE标签），不能使用已经废弃的标签等等。目前，使用最多的DOCTYPE声明为过渡型HTML或

XHTML，因为它能最大话的兼容一些老代码。不过，技术领先的公司（比如google、facebook、twitter等都如此）都已经使用了html5的

DOCTYPE声明，即<!DOCTYPE html>，它所触发的模式与严格型HTML或严格型XHTML所触发的模式完全相同，但好处是节省代码且向前兼

容（HTML5时代）。

其它激活混杂模式的情况：

前面已经介绍了，当我们不写DOCTYPE声明时，所有浏览器都会进入混杂模式。但是也存在一些因其他情况而进入混杂模式的时候，这些情

况都是我们应该避免的，最常见的就是在DOCTYPE声明前面出现了这些内容：普通文本、HTML 标签、HTML 注释、XML 声明、IE条件注

释。对于普通文本和HTML标签，各浏览器均进入了混杂模式，这个很好理解，都看到疑似的HTML文档正文了，浏览器就不需要再往下追查

DOCTYPE在哪里了。对于HTML注释和XML声明，它们和上面的普通文本和HTML标签有些差别，它们不会在页面中展示出来，即不可视。这

时，有的浏览器则显得十分“智能”，非IE浏览器均会忽略它们的存在，DOCTYPE 被正确解析。但是在IE6中，DOCTYPE之前的 XML 声明会导

致页面进入混杂模式，而如果DOCTYPE之前出现了HTML注释，则所有IE都会进入混杂模式。有的作者很聪明，他既在DOCTYPE之前加入了

他需要的内容，却又没有使IE由于这些内容而进入混杂模式。他可能会这么写：

<![if !IE]><!-- some comments --><![endif]>

<![if false]><!-- some comments --><![endif]>

上面这些IE条件注释在非IE浏览器中，可能完全被忽略，可能被解释为普通HTML注释。但是在IE中它们全部消失了，因为这就是IE条件注释

的作用。所以这也是目前比较合适的在DOCTYPE之前写点什么又保证所有浏览器均为标准模式的做法，但我们仍然不推荐在DOCTYPE之前

加入任何非空白内容。

用JS判断浏览器当前的模式：

document.write(document.compatMode == "CSS1Compat" ? "当前处于标准模式" : "当前处于混杂模式");

From: http://hi.baidu.com/flondon/item/4da1a01c3885967f7b5f2598

DOCTYPE与浏览器模式详解（标准模式&混杂模式）的更多相关文章

  1. Solr系列二：solr-部署详解（solr两种部署模式介绍、独立服务器模式详解、SolrCloud分布式集群模式详解）

    一.solr两种部署模式介绍 Standalone Server 独立服务器模式:适用于数据规模不大的场景 SolrCloud  分布式集群模式:适用于数据规模大,高可靠.高可用.高并发的场景 二.独 ...

  2. rabbitmq五种模式详解（含实现代码）

    一.五种模式详解 1.简单模式(Queue模式) 当生产端发送消息到交换机,交换机根据消息属性发送到队列,消费者监听绑定队列实现消息的接收和消费逻辑编写.简单模式下,强调的一个队列queue只被一个消 ...

  3. JavaScript严格模式详解

    转载自阮一峰的博客 Javascript 严格模式详解   作者: 阮一峰 一.概述 除了正常运行模式,ECMAscript 5添加了第二种运行模式:"严格模式"(strict m ...

  4. HTTP协议头部与Keep-Alive模式详解

    HTTP协议头部与Keep-Alive模式详解 .什么是Keep-Alive模式? 我们知道HTTP协议采用“请求-应答”模式,当使用普通模式,即非KeepAlive模式时,每个请求/应答客户和服务器 ...

  5. HTTP协议Keep-Alive模式详解

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp22 HTTP协议Keep-Alive模式详解 1.什么是Keep-Aliv ...

  6. ext.js的mvc开发模式详解

    ext.js的mvc开发模式详解和环境配置 在JS的开发过程中,大规模的JS脚本难以组织和维护,这一直是困扰前端开发人员的头等问题.Extjs为了解决这种问题,在Extjs 4.x版本中引入了MVC开 ...

  7. DES加密模式详解

    DES加密模式详解 http://www.cnblogs.com/Lawson/archive/2012/05/20/2510781.html http://www.blogjava.net/wayn ...

  8. Spartan6系列之芯片配置模式详解

    1.   配置概述 Spartan6系列FPGA通过把应用程序数据导入芯片内部存储器完成芯片的配置.Spart-6 FPGA可以自己从外部非易失性存储器导入编程数据,或者通过外界的微处理器.DSP等对 ...

  9. Activity的四种加载模式详解：

    先来看看总结图: 模式详解: standard模式: 标准启动模式,也是activity的默认启动模式.在这种模式下启动的activity可以被多次实例化,即在同一个任务中可以存在多个activity ...

  10. docker 网络概述及网络模式详解

    docker 网络概述及网络模式详解 1.网络概述 2.网络模式详解 1.网络概述: Docker 网络实现原理 Docker使用Linux桥接,在宿主机虚拟一个Docker容器网桥(docker0) ...

随机推荐

  1. python 操作sqlite数据库

    '''SQLite数据库是一款非常小巧的嵌入式开源数据库软件,也就是说 没有独立的维护进程,所有的维护都来自于程序本身. 在python中,使用sqlite3创建数据库的连接,当我们指定的数据库文件不 ...

  2. C++编写操作系统（1）：基于 EFI 的 Bootloader

    很久以前就对操作系统很好奇,用了这么多年Windows,对他的运作机理也不是很清楚,所以一直想自己动手写一个,研究一下操作系统究竟是怎么实现的.后来在网上也找到过一些教程(比如:<自己动手写操作 ...

  3. skip-grant-tables：非常有用的mysql启动参数

    skip-grant-tables:非常有用的mysql启动参数   介绍一个非常有用的mysql启动参数—— --skip-grant-tables.顾名思义,就是在启动mysql时不启动grant ...

  4. 20 个最棒的 jQuery Tab 插件

    jQuery Tab 常用来做网页上的选项设置界面和导航,本文向你推荐最棒的 20 个 jQuery Tab 插件.Enjoy !! 1. Slider Tabs SliderTabs 是一个可定制的 ...

  5. [转载]C# 判断字符是否中文还是英文

    private static bool IsHanZi(string ch) { byte[] byte_len = System.Text.Encoding.Default.GetBytes(ch) ...

  6. hdu 3718

    一个二分图最大匹配的题: 匈牙利算法不熟: 建了个模,用最小费用最大流解决了 #include <iostream> #include <cstring> #define IN ...

  7. ANDROID_MARS学习笔记_S01原始版_011_XML

    一.代码 1.xml(1)main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLay ...

  8. C​+​+​构​造​函​数​,​复​制​构​造​函​数​和​析​构​函​数​专​题

    链接:http://wenku.baidu.com/view/d9316c0e52ea551810a6872a.html 本文作者:黄邦勇帅本文是学习 C++中的最基本的内容,因此学习 C++就应全部 ...

  9. java1.8的几大新特性（一）

    一.接口的默认方法与静态方法,也就是接口中可以有实现方法 public class Test { public static void main(String[] args) { Formula a= ...

  10. JAVA线程优化

    Java并发编程:线程池的使用 在前面的文章中,我们使用线程的时候就去创建一个线程,这样实现起来非常简便,但是就会有一个问题: 如果并发的线程数量很多,并且每个线程都是执行一个时间很短的任务就结束了, ...