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 相关文章推荐
jQuery ready函数滥用分析
Feb 16 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
Oct 23 Javascript
jquery表单验证需要做些什么
Nov 17 Javascript
Node.js开启Https的实践详解
Oct 25 Javascript
jQuery实现对象转为url参数的方法
Jan 11 Javascript
webpack配置文件和常用配置项介绍
Apr 28 Javascript
requirejs按需加载angularjs文件实例
Jun 08 Javascript
ionic2自定义cordova插件开发以及使用(Android)
Jun 19 Javascript
vue+element-ui动态生成多级表头的方法
Aug 28 Javascript
Node.js对MongoDB进行增删改查操作的实例代码
Apr 18 Javascript
解决 viewer.js 动态更新图片导致无法预览的问题
May 14 Javascript
react quill中图片上传由默认转成base64改成上传到服务器的方法
Oct 30 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 多维数组排序(usort,uasort)
2010/06/30 PHP
php读取文件内容到数组的方法
2015/03/16 PHP
php获取当前url地址的方法小结
2017/01/10 PHP
CakePHP框架Session设置方法分析
2017/02/23 PHP
利用PHPExcel实现Excel文件的写入和读取
2017/04/26 PHP
javascript编程起步(第三课)
2007/02/27 Javascript
javascript TextArea动态显示剩余字符
2008/10/22 Javascript
Javascript 事件流和事件绑定
2009/07/16 Javascript
jQuery代码优化 事件委托篇
2011/11/01 Javascript
jquery得到font-size属性值实现代码
2013/09/30 Javascript
解决checkbox的attr(checked)一直为undefined问题
2014/06/16 Javascript
json实现前后台的相互传值详解
2015/01/05 Javascript
JavaScript 浏览器对象模型BOM使用介绍
2015/04/13 Javascript
JavaScript SweetAlert插件实现超酷消息警告框
2016/01/28 Javascript
javascript随机抽取0-100之间不重复的10个数
2016/02/25 Javascript
Angular.js与Bootstrap相结合实现表格分页代码
2016/04/12 Javascript
基于JavaScript实现活动倒计时效果
2017/04/20 Javascript
express框架实现基于Websocket建立的简易聊天室
2017/08/10 Javascript
layui table 参数设置方法
2018/08/14 Javascript
解决v-for中使用v-if或者v-bind:class失效的问题
2018/09/25 Javascript
vue中封装axios并实现api接口的统一管理
2020/12/25 Vue.js
Python pycharm 同时加载多个项目的方法
2019/01/17 Python
Python基于opencv调用摄像头获取个人图片的实现方法
2019/02/21 Python
详解将Python程序(.py)转换为Windows可执行文件(.exe)
2019/07/19 Python
Python的Lambda函数用法详解
2019/09/03 Python
自荐信的两点禁忌
2013/10/30 职场文书
玩具公司的创业计划书
2013/12/31 职场文书
会计专业大学生职业生涯规划范文
2014/01/11 职场文书
商务考察邀请函范文
2014/01/21 职场文书
2015年父亲节活动总结
2015/02/12 职场文书
岗位聘任报告
2015/03/02 职场文书
公司员工违法违章行为检讨书
2019/06/24 职场文书
Python django中如何使用restful框架
2021/06/23 Python
MySQL的全局锁和表级锁的具体使用
2021/08/23 MySQL
Python 恐龙跑跑小游戏实现流程
2022/02/15 Python
Nginx配置之禁止指定IP访问
2022/05/02 Servers