【Javascript Demo】JS获取当前对象大小以及屏幕分辨率等

简介:

效果如下:

代码如下:

复制代码
<html>
<head>
<title>获取当前对象大小以及屏幕分辨率等</title>
<body>
<div  style=" width:88%;margin:30px auto; color:blue;" id="div_html">
</div>
 <script type="text/javascript">
     var s = "";   
      s += " 网页可见区域宽:"+ document.body.clientWidth+"<br />";    
      s += " 网页可见区域高:"+ document.body.clientHeight+"<br />";    
      s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)"+"<br />";    
      s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)"+"<br />";    
      s += " 网页正文全文宽:"+ document.body.scrollWidth+"<br />";    
      s += " 网页正文全文高:"+ document.body.scrollHeight+"<br />";    
      s += " 网页被卷去的高(ff):"+ document.body.scrollTop+"<br />";    
      s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop+"<br />";    
      s += " 网页被卷去的左:"+ document.body.scrollLeft+"<br />";    
      s += " 网页正文部分上:"+ window.screenTop+"<br />";    
      s += " 网页正文部分左:"+ window.screenLeft+"<br />";    
      s += " 屏幕分辨率的高:"+ window.screen.height+"<br />";    
      s += " 屏幕分辨率的宽:"+ window.screen.width+"<br />";    
      s += " 屏幕可用工作区高度:"+ window.screen.availHeight+"<br />";    
      s += " 屏幕可用工作区宽度:"+ window.screen.availWidth+"<br />";    
      s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"+"<br />";    
      s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"+"<br />";  
document.getElementById(
"div_html").innerHTML = s; </script> </body> </html>
复制代码

 

代码说明图如下:






本文转自叶超Luka博客园博客,原文链接:http://www.cnblogs.com/yc-755909659/p/3944572.html,如需转载请自行联系原作者
目录
相关文章
|
15天前
|
JavaScript
JS 获取对象数据类型的键值对的键与值
JS 获取对象数据类型的键值对的键与值
|
25天前
|
JavaScript 前端开发
Math对象:JavaScript中的数学工具
Math对象:JavaScript中的数学工具
27 1
|
26天前
|
机器学习/深度学习 人工智能 JavaScript
js和JavaScript
js和JavaScript
21 4
N..
|
1月前
|
存储 JavaScript 前端开发
JavaScript中的对象
JavaScript中的对象
N..
10 0
|
18天前
|
JavaScript 算法
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
|
2天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
16 3
|
3天前
|
JavaScript 前端开发
js开发:请解释this关键字在JavaScript中的用法。
【4月更文挑战第23天】JavaScript的this关键字根据执行环境指向不同对象:全局中指向全局对象(如window),普通函数中默认指向全局对象,作为方法调用时指向调用对象;构造函数中指向新实例,箭头函数继承所在上下文的this。可通过call、apply、bind方法显式改变this指向。
7 1
|
4天前
|
JavaScript 前端开发 开发者
JavaScript中的错误处理:try-catch语句与错误对象
【4月更文挑战第22天】JavaScript中的错误处理通过try-catch语句和错误对象实现。try块包含可能抛出异常的代码,catch块捕获并处理错误,finally块则无论是否出错都会执行。错误对象提供关于错误的详细信息,如类型、消息和堆栈。常见的错误类型包括RangeError、ReferenceError等。最佳实践包括及时捕获错误、提供有用信息、不忽略错误、利用堆栈信息和避免在finally块中抛错。
|
10天前
|
JavaScript
【Js】检查Date对象是否为Invalid Date
【Js】检查Date对象是否为Invalid Date
14 0
|
10天前
|
存储 JavaScript 前端开发
JavaScript的引用数据类型主要包括对象
【4月更文挑战第16天】JavaScript的引用数据类型主要包括对象
16 4