# document.compatMode
表明当前文档的渲染模式是混杂模式还是"标准模式".
- 如果文档处于“混杂模式”，则该属性值为"BackCompat"
- 如果文档处于“标准模式”或者“准标准模式(almost standards mode)”，则该属性为"CSS1Compat"
IE对盒模型的渲染在 Standards Mode和Quirks Mode是有很大差别的，在Standards Mode下对于盒模型的解释和其他的标准浏览器是一样，但在Quirks Mode模式下则有很大差别，而在不声明Doctype的情况下，IE默认又是Quirks Mode。所以为兼容性考虑，我们可能需要获取当前的文档渲染方式。
document.compatMode正好派上用场，它有两种可能的返回值：BackCompat和CSS1Compat。 BackCompat：标准兼容模式关闭。浏览器客户区宽度是 document.body.clientWidth ；CSS1Compat：标准兼容模式开启。 浏览器客户区宽度是 document.documentElement.clientWidth。 那么写了个准确获取网页客户区的宽高、滚动条宽高、滚动条Left和Top的代码：
function xxx(){
if (document.compatMode == 'BackCompat') {
cWidth = document.body.clientWidth;
cHeight = document.body.clientHeight;
sWidth = document.body.scrollWidth;
sHeight = document.body.scrollHeight;
sLeft = document.body.scrollLeft;
sTop = document.body.scrollTop;
}else {
//document.compatMode == 'CSS1Compat'
cWidth = document.documentElement.clientWidth;
cHeight = document.documentElement.clientHeight;
sWidth = document.documentElement.scrollWidth;
sHeight = document.documentElement.scrollHeight;
sLeft = document.documentElement.scrollLeft == 0 ? document.body.scrollLeft : document.documentElement.scrollLeft;
sTop = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
}
}
- 这个函数必须在页面加载完成后才能运行，否则document对象还没生成，浏览器会报错。
- 大多数情况下，都是document.documentElement.clientWidth返回正确值。但是，在IE6的quirks模式中，document.body.clientWidth返回正确的值，因此函数中加入了对文档模式的判断。
- clientWidth和clientHeight 都是只读属性，不能对它们赋值。
<!DOCTYPE html>声明的重要性