JS基本语法-JavaScript中的常用对象7-screen对象，获取计算机的显示特性，包括宽度，高度等

liranke

已于 2022-01-29 11:49:50 修改

阅读量2.3k

点赞数

分类专栏： JavaScript笔记文章标签： javascript 前端屏幕大小 screen 屏幕颜色

于 2022-01-29 11:48:20 首次发布

本文链接：https://blog.csdn.net/liranke/article/details/122740720

版权

JavaScript笔记专栏收录该内容

21 篇文章 1 订阅

订阅专栏

简介：

screen对象描述了用户计算机中的各种显示相关的特性，例如，屏幕像素高度，宽度，颜色深度，可用屏幕区域大小等。

screen对象的最常用的使用场景是：

需要适配不同的显示比例时。

程序举例：

从通过screen对象获取屏幕参数信息。

screen.js

function getScreenParam(){
  console.log(navigator.userAgent);

  var h = screen.height;
  var w = screen.width;
  var colorDepth = screen.colorDepth;
  var res= "高度：" + h + ";   宽度：" + w + ";   颜色深度：" + colorDepth;
  document.getElementById("screen_data").innerHTML = res;
  
}

screen.html:

<!DOCTYPE html>
<html>
<body>
	<script src="./screen.js"></script>

<h1>window.screen对象的属性</h1>
<p id="screen_data"></p>

<script>
	getScreenParam();
</script>
</body>
</html>

运行结果（我的浏览器中的运行结果如下）：

window.screen对象的属性

高度：1080; 宽度：1920; 颜色深度：24

screen的属性和方法：

属性：

screen.width：屏幕宽度，单位：像素；
screen.height：屏幕高度，单位：像素；
screen.availWidth：屏幕的可用宽度，单位：像素；
screen.availHeight：屏幕的可用高度，单位：像素；
screen.colorDepth：屏幕的颜色深度（所有现代计算机都使用 24 位或 32 位硬件的色彩分辨率）；
screen.pixelDepth：像素深度（现代计算机的颜色深度和像素深度的值是一样的）。

liranke

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
JS基本语法-JavaScript中的常用对象7-screen对象，获取计算机的显示特性，包括宽度，高度等

screen对象描述了用户计算机中的各种显示相关的特性，例如，屏幕像素高度，宽度，颜色深度，可用屏幕区域大小等。
复制链接

扫一扫