JS、JAVA等获取当前对象大小以及屏幕分辨率等

最新推荐文章于 2023-06-16 16:27:47 发布

hepeng_8

最新推荐文章于 2023-06-16 16:27:47 发布

阅读量1.7k

点赞数

分类专栏： JavaScript J2EE

本文链接：https://blog.csdn.net/hepeng_8/article/details/32731153

版权

J2EE 同时被 2 个专栏收录

30 篇文章 0 订阅

订阅专栏

JavaScript

15 篇文章 0 订阅

订阅专栏

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">JAVA获取：</span>

 public static void main(String[] args) {
       Dimension dim = Toolkit.getDefaultToolkit().getScreenSize();
       System.out.println("Width: " + dim.width);
       System.out.println("Height: " + dim.height);
    }

JavaScript获取：

<html>
<head>
<title>检测显示器分辨率</title>
</head>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
document.write('分辨率为:\n' + screen.width + '*' + screen.height + ' pixels');
 -->
</SCRIPT>
</body>
</html>

用它来控制网页宽度不错，根据显示器大小判断DIV宽度
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>test</title>
  <meta name="author" content="Administrator" />
  <!-- Date: 2011-10-25 -->
  <script language="JavaScript">
function a(){
document.write(
"屏幕分辨率为："+screen.width+"*"+screen.height
+"<br />"+
"屏幕可用大小："+screen.availWidth+"*"+screen.availHeight
+"<br />"+
"网页可见区域宽："+document.body.clientWidth
+"<br />"+
"网页可见区域高："+document.body.clientHeight
+"<br />"+
"网页可见区域宽(包括边线的宽)："+document.body.offsetWidth 
+"<br />"+
"网页可见区域高(包括边线的宽)："+document.body.offsetHeight 
+"<br />"+
"网页正文全文宽："+document.body.scrollWidth
+"<br />"+
"网页正文全文高："+document.body.scrollHeight
+"<br />"+
"网页被卷去的高："+document.body.scrollTop
+"<br />"+
"网页被卷去的左："+document.body.scrollLeft
+"<br />"+
"网页正文部分上："+window.screenTop
+"<br />"+
"网页正文部分左："+window.screenLeft
+"<br />"+
"屏幕分辨率的高："+window.screen.height
+"<br />"+
"屏幕分辨率的宽："+window.screen.width
+"<br />"+
"屏幕可用工作区高度："+window.screen.availHeight
+"<br />"+
"屏幕可用工作区宽度："+window.screen.availWidth
);
}
</script>
  </head>
  
<body οnlοad="a()" >
</body>
</html>
京东商城上根据分辨率调整页面的大小实例
<script type="text/javascript">if (screen.width>=1280){document.write("<style type='text/css'>.w{width:1200px;}.middle{width:766px;}.right-extra{width:983px;}#search{width:332px;padding:1px;}#i-search{width:257px;}#tie{width:257px;}#tie li{width:252px;}#key{width:228px;}#btn-search{background:none;}#hotwords{width:410px;}#service dl{width:192px;padding-left:39px;}#service .fore1{padding-left:20px;}#service .fore5{width:200px;}#service li{padding:0 35px;}#madding-1 dl{width:235px;}#madding-1 .p-price{right:50px;}.madding-2 li,.madding-3 li{width:239px;}#newpros .mc{width:766px;}#newpros .mc ul{width:766px;}#newpros li{width:235px;}#slide{width:766px;}#slide ul{width:766px;}#slide li{width:766px;}.special .mc{width:763px;}.special li{width:234px;}</style>");} </script>
#javascript学习

如下是获取各种网页的宽、高、或者分辨率的方式：

网页可见区域宽：document.body.clientWidth 
网页可见区域高：document.body.clientHeight 
网页可见区域宽：document.body.offsetWidth (包括边线和滚动条的宽) 
网页可见区域高：document.body.offsetHeight(包括边线的宽) 
网页正文全文宽：document.body.scrollWidth 
网页正文全文高：document.body.scrollHeight 
网页被卷去的高：document.body.scrollTop 
网页被卷去的左：document.body.scrollLeft 
网页正文部分上：window.screenTop 
网页正文部分左：window.screenLeft 
屏幕分辨率的高：window.screen.height 
屏幕分辨率的宽：window.screen.width 
屏幕可用工作区高度：window.screen.availHeight 
屏幕可用工作区宽度：window.screen.availWidth 
屏幕设置 window.screen.colorDepth 位彩色 
屏幕设置 window.screen.deviceXDPI 像素/英寸