JavaScript BOM Window Screen

浏览器对象模型（BOM）是一种特定于浏览器的约定，指的是浏览器提供的所有对象。BOM允许JavaScript与浏览器进行“交互”。window对象表示浏览器窗口及其所有相关功能。窗口对象是浏览器自动创建的。JavaScript的window.screen对象包含了有关用户屏幕的信息。它也可以省略window前缀。

属性：

• screen.width
• screen.height
• screen.availWidth
• screen.availHeight
• screen.colorDepth
• screen.pixelDepth

下面的示例将演示所有属性的用法：

HTML screen.width属性： screen.width属性以像素为单位返回用户屏幕的宽度。

<p id="GFG"></p> 
  
<script> 
    document.getElementById("GFG").innerHTML = 
    " The Screen width is " + screen.width; 
</script>

输出：

The Screen width is 1600

HTML screen.height Property: 屏幕高度属性返回用户屏幕高度，单位为像素。

<p id="GFG"></p> 
  
<script> 
    document.getElementById("GFG").innerHTML = 
    " The screen height is " + screen.height; 
</script>

输出：

The screen height is 900

HTML screen.availWidth 属性 :

screen.availWidth 属性以像素为单位返回用户屏幕的宽度，不包括界面特性。

<p id="GFG"></p> 
  
<script> 
    document.getElementById("GFG").innerHTML = 
    "The available screen width is " + screen.availWidth; 
</script>

输出：

The available screen width is 1549

HTML screen.availHeight 属性 : The screen.availHeight 属性返回用户屏幕高度（不包括界面特征）的像素数。

<p id="GFG"></p> 
  
<script> 
    document.getElementById("GFG").innerHTML = 
    "The available screen height is " + screen.availHeight; 
</script>

输出:

The available screen height is 876

HTML 屏幕颜色深度属性 : 屏幕颜色深度属性返回用于显示一种颜色的比特数。通常采用24位或32位硬件进行颜色分辨率。24位 = 16, 777, 216种不同的（真彩色）32位 = 4, 294, 967, 296种不同的（深度色）

<p id="GFG"></p> 
  
<script> 
    document.getElementById("GFG").innerHTML = 
    "The screen color depth is " + screen.colorDepth; 
</script>

输出：

The screen color depth is 24

HTML屏幕.pixelDepth属性： 该属性返回屏幕的像素深度。

<p id="GFG"></p> 
  
<script> 
    document.getElementById("GFG").innerHTML = 
    "The screen pixel depth is " + screen.pixelDepth; 
</script>

输出：

The screen pixel depth is 24

支持的浏览器：

• Google Chrome 1 及以上版本
• Edge 12 及以上版本
• Firefox 1 及以上版本
• Internet Explorer 4 及以上版本
• Opera 12.1 及以上版本
• Safari 1 及以上版本