嚴格模式和怪異模式

概念

早期的瀏覽器並不遵守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並非怪異模式