谷歌瀏覽器不支援document.documentElement.scrollTop，值0的問題 
　　資訊顯示浮動層時，IE、Firefox下都能顯示正常，但Chrome下出現了浮動層永遠顯示在上面，經過仔細分析，發現Chrome對document.documentElement.scrollTop的識別會出現誤差。不過加上document.body.scrollTop後，則顯示正常。 
　　由於document.documentElement.scrollTop和document.body.scrollTop在標準模式或者是奇怪模式下都只有一個會返回有效的值，所以都加上也不會有問題（看來上面的問題是Chrome可能把文件當作非標準文件來解析了）。

效果:

單擊按鈕====》直接跳到指定的精品小面

轉： https://blog.csdn.net/xyr05288/article/details/51680048

三、瀏覽器相容模式 
對於document.compatMode，很多朋友可能都根我一樣很少接觸，知道他的存在卻不清楚他的用途。今天在ext中看到 document.compatMode的使用，感覺這個對於我們開發相容性的web頁面還是很有幫助，我們都知道，IE對盒模型的渲染在 Standards Mode和Quirks Mode是有很大差別的，在Standards Mode下對於盒模型的解釋和其他的標準瀏覽器是一樣，但在Quirks Mode模式下則有很大差別，而在不宣告Doctype的情況下，IE預設又是Quirks Mode。所以為相容性考慮，我們可能需要獲取當前的文件渲染方式。 
　　 
document.compatMode正好派上用場，它有兩種可能的返回值：BackCompat和CSS1Compat，對其解釋如下： 
BackCompat Standards-compliant mode is not switched on. (Quirks Mode) 
CSS1Compat Standards-compliant mode is switched on. (Standards Mode)

當文件有了標準宣告時， document.compatMode 的值就等於 “CSS1compat”， 因此， 我們可以根據 document.compatMode 的值來判斷文件是否加了標準宣告 
var height = document.compatMode==”CSS1Compat” ? 
document.documentElement.clientHeight : document.body.clientHeight;

==========================模式應用===========================

document.compatMode:獲取當前瀏覽器採用的渲染方式。主要是瀏覽器的模式，有兩個：BackCompat，CSS1Compat。其中前者是怪異模式，後者是標準模式。

IE預設是BackCompat模式，Gecko核心的瀏覽器只在table中圖片層上不同，可以認為CSS1Compat標準模式document.compatMode等於BackCompat時，瀏覽器客戶區寬度是document.body.clientWidth；

當document.compatMode等於CSS1Compat時，瀏覽器客戶區寬度是document.documentElement.clientWidth。 
瀏覽器客戶區高度、滾動條高度、滾動條的Left、滾動條的Top等等都是上面的情況。 
一個準確獲取網頁客戶區的寬高、滾動條寬高、滾動條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;
}

以上程式碼相容目前流行的全部瀏覽器，包括：IE、Firefox、Safari、Opera、Chrome）