严格模式和怪异模式

概念

早期的浏览器并不遵守W3C标准，这时候的解析方式就称之为怪异模式(quirks mode)。但随着W3C模式越来越重要，众多的浏览器开始依照W3C标准解析CSS，仿照W3C标准解析CSS的模式就是严格模式(strict mode)

使用

document.compatMode
值为 BackCompat ，则是怪异模式
值为 CSS1Compat ，则是严格模式

使用范围

怪异模式一般使用在低版本的IE浏览器中
严格模式一般使用在谷歌、火狐等高版本的浏览器中
这样就会涉及到兼容性的问题

兼容性问题示例

这里以JS中的scroll家族示例，以下版本在谷歌、火狐中与在低版本IE浏览器中输出的结果是不一样的

CSS样式

<style>
    body {
        height: 2000px;
    }
</style>

JS代码

<script>
    window.onscroll = function() {
        //在火狐和谷歌中没有作用  在IE中有作用  存在兼容性问题
        console.log(document.body.scrollTop);
        //输出是严格模式还是怪异模式
        console.log(document.compatMode);
   
    }
</script>

谷歌显示

页面无论怎么滑动，输出的document.body.scrollTop总是为零

IE浏览器显示

页面滑动，输出的document.body.scrollTop改变
我在这里使用的并非低版本的IE浏览器，所以输出的document.compatMode并非怪异模式