JS获取屏幕高度的简单实现代码


Posted in Javascript onMay 24, 2016

主要使用了document对象关于窗口的一些属性,这些属性的主要功能和用法如下。

要得到窗口的尺寸,对于不同的浏览器,需要使用不同的属性和方法:若要检测窗口的真实尺寸,在netscape下需要使用window的属性;在ie下需 要深入document内部对body进行检测;在dom环境下,若要得到窗口的尺寸,需要注意根元素的尺寸,而不是元素。

window对象的innerwidth属性包含当前窗口的内部宽度。window对象的innerheight属性包含当前窗口的内部高度。

document对象的body属性对应html文档的标签。document对象的documentelement属性则表示html文档的根节点。

document.body.clientheight表示html文档所在窗口的当前高度。document.body. clientwidth表示html文档所在窗口的当前宽度。

js获取屏幕高度var s = "";

s += " 网页可见区域宽:"+ document.body.clientwidth;

s += " 网页可见区域高:"+ document.body.clientheight;

s += " 网页可见区域宽:"+ document.body.offsetwidth +" (包括边线和滚动条的宽)";

s += " 网页可见区域高:"+ document.body.offsetheight +" (包括边线的宽)";

s += " 网页正文全文宽:"+ document.body.scrollwidth;

s += " 网页正文全文高:"+ document.body.scrollheight;

s += " 网页被卷去的高:"+ document.body.scrolltop;

s += " 网页被卷去的左:"+ document.body.scrollleft;

s += " 网页正文部分上:"+ window.screentop;

s += " 网页正文部分左:"+ window.screenleft;

s += " 屏幕分辨率的高:"+ window.screen.height;

s += " 屏幕分辨率的宽:"+ window.screen.width;

s += " 屏幕可用工作区高度:"+ window.screen.availheight;

s += " 屏幕可用工作区宽度:"+ window.screen.availwidth;

s += " 你的屏幕设置是 "+ window.screen.colordepth +" 位彩色";

s += " 你的屏幕设置 "+ window.screen.devicexdpi +" 像素/英寸";

以上这篇JS获取屏幕高度的实现代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS URL传中文参数引发的乱码问题
Sep 02 Javascript
JavaScipt中的Math.ceil() 、Math.floor() 、Math.round() 三个函数的理解
Apr 29 Javascript
JavaScript动态插入script的基本思路及实现函数
Nov 11 Javascript
jquery实现拖拽调整Div大小
Jan 30 Javascript
js限制input标签中只能输入中文
Jun 26 Javascript
js实时获取窗口大小变化的实例代码
Nov 18 Javascript
JavaScript模拟文件拖选框样式v1.0的实例
Aug 04 Javascript
通过JavaScript下载文件到本地的方法(单文件)
Mar 17 Javascript
setTimeout与setInterval的区别浅析
Mar 23 Javascript
JS学习笔记之原型链和利用原型实现继承详解
May 29 Javascript
ES6 新增的创建数组的方法(小结)
Aug 01 Javascript
JavaScript 函数用法详解【函数定义、参数、绑定、作用域、闭包等】
May 12 Javascript
基于JavaScript实现回到页面顶部动画代码
May 24 #Javascript
jquery简单插件制作(fn.extend)完整实例
May 24 #Javascript
jQuery获取及设置表单input各种类型值的方法小结
May 24 #Javascript
jQuery+php实时获取及响应文本框输入内容的方法
May 24 #Javascript
jQuery中事件与动画的总结分享
May 24 #Javascript
jQuery根据表单name获取值的方法
May 24 #Javascript
深入理解jquery自定义动画animate()
May 24 #Javascript
You might like
php公用函数列表[正则]
2007/02/22 PHP
PHP中如何调用webservice的实例参考
2013/04/25 PHP
PHP二维数组排序的3种方法和自定义函数分享
2014/04/09 PHP
PHP中构造函数和析构函数解析
2014/10/10 PHP
教你如何开启shopnc b2b2c 伪静态
2014/10/21 PHP
PHP生成随机密码方法汇总
2015/08/27 PHP
PHP判断字符串长度的两种方法很实用
2015/09/22 PHP
php获取文章内容第一张图片的方法示例
2017/07/03 PHP
Z-Blog中用到的js代码
2007/03/15 Javascript
js实现在页面上弹出蒙板技巧简单实用
2013/04/16 Javascript
js动态拼接正则表达式的两种方法
2014/03/04 Javascript
页面刷新时记住滚动条的位置jquery代码
2014/06/17 Javascript
解决WordPress使用CDN后博文无法评论的错误
2015/12/15 Javascript
EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)
2016/02/21 Javascript
基于AGS JS开发自定义贴图图层
2017/03/31 Javascript
js实现canvas图片与img图片的相互转换的示例
2017/08/31 Javascript
微信小程序自定义组件实现环形进度条
2020/11/17 Javascript
JS实现判断移动端PC端功能
2020/02/21 Javascript
HTML+JS实现“代码雨”效果源码(黑客帝国文字下落效果)
2020/03/17 Javascript
Javascript Symbol原理及使用方法解析
2020/10/22 Javascript
Python函数式编程
2017/07/20 Python
Python 装饰器使用详解
2017/07/29 Python
python requests 测试代理ip是否生效
2018/07/25 Python
Python中的支持向量机SVM的使用(附实例代码)
2019/06/26 Python
Python 通过截图匹配原图中的位置(opencv)实例
2019/08/27 Python
Python 异常的捕获、异常的传递与主动抛出异常操作示例
2019/09/23 Python
django 框架实现的用户注册、登录、退出功能示例
2019/11/28 Python
彪马土耳其官网:PUMA土耳其
2019/07/14 全球购物
恒华伟业笔试面试题
2015/02/26 面试题
致裁判员加油稿
2014/02/08 职场文书
大学生个人求职口试自我评价
2014/02/16 职场文书
党员志愿者活动方案
2014/08/28 职场文书
新员工考核评语
2014/12/31 职场文书
html实现随机点名器的示例代码
2021/04/02 Javascript
iPhone13再次曝光
2021/04/15 数码科技
python tkinter Entry控件的焦点移动操作
2021/05/22 Python