Understanding Document.compatmode Properties

This is the front-end of those things to see, I quote come over, convenient to look at later, query

Document.compatmode is used to determine the rendering method used by the current browser.

Official explanation:

Backcompat: Standard compatibility mode is off.
Css1compat: Standard compatibility mode is turned on.

When Document.compatmode equals Backcompat, the width of the browser client area is document.body.clientWidth;
When Document.compatmode equals Css1compat, the browser client area width is document.documentElement.clientWidth.

The height of the browser client area, the height of the scrollbar, the left of the scroll bar, the top of the scroll bar, and so on are all the above cases.

A code that accurately obtains the width, height, scroll bar, left, and top of the page's customer area:

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;
}

(The above code is compatible with all currently popular browsers, including: IE, Firefox, Safari, Opera, Chrome)

Understanding Document.compatmode Properties