今天看一個(gè)插件的源碼,看到了document.compatMode的用法,用來(lái)判斷瀏覽器是否是標(biāo)準(zhǔn)的兼容模式抖部,經(jīng)過(guò)查找一些資料,終于明白了禾蚕。下面是一些說(shuō)明您朽。
文檔模式在開(kāi)發(fā)中貌似很少用到,最常見(jiàn)的是就是在獲取頁(yè)面寬高的時(shí)候换淆,比如文檔寬高哗总,可見(jiàn)區(qū)域?qū)捀叩取?br>
IE對(duì)盒模型的渲染在 Standards Mode和Quirks Mode是有很大差別的,在Standards Mode下對(duì)于盒模型的解釋和其他的標(biāo)準(zhǔn)瀏覽器是一樣倍试,但在Quirks Mode模式下則有很大差別讯屈,而在不聲明Doctype的情況下,IE默認(rèn)又是Quirks Mode县习。所以為兼容性考慮涮母,我們可能需要獲取當(dāng)前的文檔渲染方式。<p>
document.compatMode正好派上用場(chǎng)躁愿,它有兩種可能的返回值:BackCompat和CSS1Compat叛本。
BackCompat:標(biāo)準(zhǔn)兼容模式關(guān)閉。瀏覽器客戶(hù)區(qū)寬度是document.body.clientWidth彤钟;CSS1Compat:標(biāo)準(zhǔn)兼容模式開(kāi)啟来候。 瀏覽器客戶(hù)區(qū)寬度是document.documentElement.clientWidth。
那么寫(xiě)了個(gè)準(zhǔn)確獲取網(wǎng)頁(yè)客戶(hù)區(qū)的寬高逸雹、滾動(dòng)條寬高营搅、滾動(dòng)條Left和Top的代碼:
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;
}