JavaScript获取屏幕对象

屏幕对象介绍

屏幕对象（screen）提供了获取显示器信息的功能，显示器信息的主要用途是确定网页在客户机是所能达到的最大显示空间。很多情况下，用户的显示器大小尺寸不尽相同，以同一尽寸设计的网页往往得不到期望的效果。为此需得知用户显示器的信息，在运行时

确定网页的布局 

检测显示器参数

检测显示器参数有助于确定网页在客户机上所能显示的大小，主要使用screen对象提供的接口。显示的参数一般都包括显示面积的宽、高度和色深等，其中宽、高度是比较有意义的，直接与网布局相关，色深只是影响图形色彩的逼真程度 。

Js代码 

1. <Script language="javascript">              
2.     with (document)             //用with语句引用document的属性  
3.     {  
4.         write ("您的屏幕显示设定值如下：<p>");    //输出提示语句  
5.         write ("屏幕的实际高度为", screen.availHeight, "<br>");//输出屏幕的实际高  
6.         write ("屏幕的实际宽度为", screen.availWidth, "<br>");//输出屏幕的实际宽  
7.         write ("屏幕的色盘深度为", screen.colorDepth, "<br>");//输出屏幕的盘深度  
8.         write ("屏幕区域的高度为", screen.height, "<br>");    //输出屏幕的区域高度  
9.         write ("屏幕区域的宽度为", screen.width);   //输出屏幕的区域宽度  
10.         write("", screen.height,"<br>");  
11.         write(sereen.availHeight);  
12.     }  
13. </Script>           

 

客户端显示器屏幕分辨率 

显示器分辨率是指显示器所能显示的宽度和高度，通常以像素（pixel）为单位，例如笔者的显示器的分辨率为1280*800。在实际应用中，为了使制作的网页能适应不同的浏览器环境，最好使用JavaScript程序对用户的显示器进行检测，动态调整网页的布局 。

客户端显示器屏幕的有效宽度和高度 

有效宽度和高度，是指打开客户端浏览器，所能达到的最大宽度和高度。在不同的操作系统中，操作系统本身也要占用一定的显示区域，所以在浏览器窗口以最大化打开时，不一定占满整个显示器屏幕。因此，有效宽度和高度就是指浏览器窗口所能占据的最大宽度

和高度 。

 

Java代码 

1. <Script language="javascript">              
2.     with(document)                  // 设置上下文  
3.     {  
4.         writeln(" 网页可见区域宽："+ document.body.clientWidth+"<br>");       // 网页可见区域宽  
5.         writeln( " 网页可见区域高："+ document.body.clientHeight+"<br>");     // 网页可见区域高  
6.         writeln(" 网页可见区域宽："+ document.body.offsetWidth + " (包括边线和滚动条的宽)"+"<br>");  
7.         writeln( " 网页可见区域高："+ document.body.offsetHeight + " (包括边线的宽)"+"<br>");  
8.         writeln(" 网页正文全文宽："+ document.body.scrollWidth+"<br>");       // 网页正文全文宽  
9.         writeln(" 网页正文全文高："+ document.body.scrollHeight+"<br>");      // 网页正文全文高  
10.         writeln( " 网页被卷去的高(ff)："+ document.body.scrollTop+"<br>");        // 网页被卷去顶部分(ff)  
11.         writeln(" 网页被卷去的高(ie)："+ document.documentElement.scrollTop+"<br>");  
12.         writeln( " 网页被卷去的左："+ document.body.scrollLeft+"<br>");       // 网页被卷去左部分  
13.         writeln( " 网页正文部分上："+ window.screenTop+"<br>");   // 网页正文部分上  
14.         writeln( " 网页正文部分左："+ window.screenLeft+"<br>");  // 网页正文部分左  
15.         writeln( " 屏幕分辨率的高："+ window.screen.height+"<br>");   // 分辨率高  
16.         writeln(" 屏幕分辨率的宽："+ window.screen.width+"<br>"); // 分辨率宽  
17.         writeln(" 屏幕可用工作区高度："+ window.screen.availHeight+"<br>");// 有效工作区高度  
18.         writeln( " 屏幕可用工作区宽度："+ window.screen.availWidth+"<br>");// 有效工作区宽度  
19.     }  
20.    </script>