web前端之浏览器篇——compatMode混杂模式和标准模式
一、介绍
浏览器解析文档时会按document.compatMode属性来渲染。
其值是个枚举值,如下:
“BackCompat”:怪异模式,也称混杂模式
“CSS1Compat”:标准模式或者准标准模式。
另外,准标准模式已和标准模式相同,两者已被标准模式代替。
二、compatMode兼容性
具体兼容浏览器版本如下:
三、区别
IE对css样式盒模型的渲染在 Standards Mode和Quirks Mode这两者模式下有很大区别,当html没有Doctype声明时ie默认是Quirks Mode,标准的模式下不同浏览器渲染方式一样,故从兼容性考虑需要对ie多不同处理。(亲测ie6以上支持Standards Mode)
在获取页面或区域宽高,滚动条位置有很大区别,如下:
样式 | Standards Mode | Quirks Mode |
---|---|---|
height | document.documentElement.clientHeight | document.body.clientHeight; |
width | document.documentElement.clientWidth | document.body.clientWidth |
scrollWidth | document.documentElement.scrollWidth | document.body.scrollWidth |
scrollHeight | document.documentElement.scrollHeight | document.body.scrollHeight |
scrollLeft | document.documentElement.scrollLeft | document.body.scrollLeft |
scrollTop | document.documentElement.scrollTop | document.body.scrollTop |