document.compatMode

今天看到了document.compatMode属性，平时对文档模式不是很了解，于是test了这个属性。

document.compatMode的值有两种，分别为"BackCompat"和"Css1Compat".

BackCompat 代表标准兼容模式关闭

Css1Compat 代表标准兼容模式开启

所谓的标准兼容模式未开启即“混杂模式”（又叫怪异模式，Quirks mode）。

标准兼容模式已开启即“标准模式”（又叫严格模式，Standards mode 或者 Strict mode）。

在没有书写 DOCTYPE 的 HTML 文档在所有浏览器中均会以混杂模式进行渲染和解析。

微软开发的 IE 系列浏览器中寿命最长的 IE6 伴随 Windows XP 诞生。相比上一个版本 IE5.5，IE6 确实有着许多重大的改进，其中对于页面渲染而言最大的变化就在于 IE6 支持了部分 CSS1 中的特性。例如，为一个块级元素设定宽度及高度时，不再作用于 border 外围，而是如 W3C 规范中所描述的仅仅是元素内容之上。这一点和 IE5.5 差别巨大。为了保证那些 90 年代后期的基于 IE6 之前版本开发的页面能够正常显示，即保证浏览器有向后兼容性，此“开关”诞生，微软试图通过对 DOCTYPE 的判断来决定浏览器采取何种模式工作，即是 IE6 还是 IE5.5 的问题。所以从 document.compatMode 返回的字符串值中也可以看出来，BackCompat 代表了向后兼容（即 IE5.5），CSS1Compat 代表了对 CSS1 规范的兼容（即 IE6）。由此，浏览器的工作模式被分为了混杂模式及标准模式。

值得注意的是，IE 的版本号一路从 6.0 升至了目前的 9.0，但升级仅限于标准模式。对于混杂模式，IE 的版本号永久的冻结在 5.5，这也算是为了向后兼容的巨大牺牲。也就是说即使我们使用着最新最高级的 IE9，但若我们不书写 DOCTYPE 或者使用了能够触发混杂模式的 DOCTYPE，那我们所面对的浏览器仍相当于是那个十几年前的老古董 IE5.5。而其他那些浏览器的混杂模式和标准模式之间却没有想 IE 中这么大的差别。

近似标准模式（Almost Standards Mode）从字面意思上看与标准模式非常类似，但确实有小的差别。主要体现在对于表格单元格内垂直方向布局渲染差异。IE8 开始、Firefox、Chrome、Safari、Opera 7.5 开始，这些浏览器的标准模式更加严格的遵循了 CSS2.1 规范，故对于在目前看来不太“标准”的以前的标准模式，被赋予了“近似标准模式”的名字。但是在较早的 IE6 IE7 以及 Opera 7.5 之前版本中，浏览器无法严格遵循 CSS2.1 规范，故对于它们来说没有这个近似标准模式，也可以理解为它们的近似标准模式就是标准模式。

到目前为止，可以看到各浏览器主要包含了三种模式。

混杂模式

标准模式

近似标准模式

回到document.compatMode

当document.compatMode为

BackCompat时，浏览器客户区宽度是document.body.clientWidth

CSS1Compat：浏览器客户区宽度是document.documentElement.clientWidth。