Method to get various browser window sizes

Commonly used:
JS gets the size of the browser window

//Get window width
if (window.innerWidth) 
winWidth = window.innerWidth; 
else if ((document.body) && (document.body.clientWidth)) 
winWidth = document.body.clientWidth; 
//Get window height
if (window.innerHeight) 
winHeight = window.innerHeight; 
else if ((document.body) && (document.body.clientHeight)) 
winHeight = document.body.clientHeight; 
//Get the window size by detecting the body inside the Document
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth) 
{ 
winHeight = document.documentElement.clientHeight; 
winWidth = document.documentElement.clientWidth; 
} 

Details:
About getting visible window sizes for various browsers:
< Script>
The function getInfo ()
{
Var s = "";
S = "page visible region wide:" document. Body. ClientWidth;
S = "page visible region high:" document. Body. ClientHeight;
S = "page visible region wide:" document. The body. The offsetWidth "(including the edges and the width of the scroll bar)";
S = "page visible region high:" document. The body. The offsetHeight "(including line width)";
S = "full width page text:" document. Body. ScrollWidth;
S = "high full page text:" document. Body. ScrollHeight;
S = "web page volume high (ff) :" document.body.scrolltop;
S = "web swept to high (ie)," the document. The documentElement. ScrollTop;
S = "to the left of the page to be rolled:" document.body.scrollleft;
S = "window.screenTop;
S = "left of body:" window.screenLeft;
S = "window.screen.height;
S = "width of screen resolution:" window.screen.width;
S = "screen can use the workspace height:" window. Screen. AvailHeight;
S = "screen available workspace width:" window.screen.availwidth;

S = "your screen setting is" window.screen.colordepth ";
S = "your screen Settings" window.screen.devicexdpi "pixels per inch ";
/ / alert (s);
}
GetInfo ();
< / script>
In my local test:
It works with IE, FireFox, and Opera
Document. Body. ClientWidth
Document. Body. ClientHeight
Accessible, very simple, very convenient.
And in the company's projects:

Opera still USES
Document. Body. ClientWidth
Document. Body. ClientHeight

Internet explorer and FireFox do
Document. The documentElement. ClientWidth
Document. The documentElement. ClientHeight

W3C standards are to blame
< ! PUBLIC DOCTYPE HTML "- / / / / W3C DTD XHTML 1.0 Transitional / / EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

If you add this line of markup to the page, in IE:
Document. Body. ClientWidth = = > BODY object width
Document. Body. ClientHeight = = > BODY object height
Document. The documentElement. ClientWidth = = > Visible area width
Document. The documentElement. ClientHeight = = > Height of visible area

In FireFox:
Document. Body. ClientWidth = = > BODY object width
Document. Body. ClientHeight = = > BODY object height
Document. The documentElement. ClientWidth = = > Visible area width
Document. The documentElement. ClientHeight = = > Height of visible area
 

In the Opera:
Document. Body. ClientWidth = = > Visible area width
Document. Body. ClientHeight = = > Height of visible area
Document. The documentElement. ClientWidth = = > Page object width (that is, BODY object width plus Margin width)
Document. The documentElement. ClientHeight = = > Page object height (BODY object height plus Margin height)
If no W3C standard is defined, then

IE is:
Document. The documentElement. ClientWidth = = > 0
Document. The documentElement. ClientHeight = = > 0

FireFox is:
Document. The documentElement. ClientWidth = = > Page object width (that is, the object of BODY width and Margin wide) document. The documentElement. ClientHeight = = > Page object height (BODY object height plus Margin height)

The Opera is:
Document. The documentElement. ClientWidth = = > Page object width (that is, the object of BODY width and Margin wide) document. The documentElement. ClientHeight = = > Page object height (BODY object height plus Margin height)