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版本A*寻路算法
Dec 22 Javascript
使用户点击后退按钮使效三行代码
Jul 07 Javascript
JQuery结合CSS操作打印样式的方法
Dec 24 Javascript
js控制分页打印、打印分页示例
Feb 08 Javascript
Javascript中的方法链(Method Chaining)介绍
Mar 15 Javascript
jQuery 移动端artEditor富文本编辑器
Jan 11 Javascript
js实现扫雷小程序的示例代码
Sep 27 Javascript
node.js基于fs模块对系统文件及目录进行读写操作的方法详解
Nov 10 Javascript
Angular4.x Event (DOM事件和自定义事件详解)
Oct 09 Javascript
使用jquery模拟a标签的click事件无法实现跳转的解决
Dec 04 jQuery
微信小程序实现下拉框功能
Jul 16 Javascript
js实现简单的打印表格
Jan 15 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类
2006/07/15 PHP
PHP Token(令牌)设计
2008/03/15 PHP
php实现分页工具类分享
2014/01/09 PHP
PHP header()函数常用方法总结
2014/04/11 PHP
在 Laravel 中 “规范” 的开发短信验证码发送功能
2017/10/26 PHP
Jquery下:nth-child(an+b)的使用注意
2011/05/28 Javascript
javascript小数四舍五入多种方法实现
2012/12/23 Javascript
一款jquery特效编写的大度宽屏焦点图切换特效的实例代码
2013/08/05 Javascript
js获取指定日期前后的日期代码
2013/08/20 Javascript
通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位
2014/05/05 Javascript
js操作css属性实现div层展开关闭效果的方法
2015/05/11 Javascript
javascript学习笔记之函数定义
2015/06/25 Javascript
javascript如何写热点图
2015/12/08 Javascript
实例讲解DataTables固定表格宽度(设置横向滚动条)
2017/07/11 Javascript
axios全局注册,设置token,以及全局设置url请求网段的方法
2018/09/25 Javascript
详解50行代码,Node爬虫练手项目
2019/04/22 Javascript
js实现简单掷骰子小游戏
2019/10/24 Javascript
extjs图形绘制之饼图实现方法分析
2020/03/06 Javascript
JavaScript进阶(三)闭包原理与用法详解
2020/05/09 Javascript
vue实现div可拖动位置也可改变盒子大小的原理
2020/09/16 Javascript
Python实现选择排序
2017/06/04 Python
Python中使用支持向量机SVM实践
2017/12/27 Python
python通过elixir包操作mysql数据库实例代码
2018/01/31 Python
PyQt5打开文件对话框QFileDialog实例代码
2018/02/07 Python
tensorflow实现逻辑回归模型
2018/09/08 Python
pandas.read_csv参数详解(小结)
2019/06/21 Python
DJango的创建和使用详解(默认数据库sqlite3)
2019/11/18 Python
Qoo10台湾站:亚洲领先的在线市场
2018/05/15 全球购物
周生生珠宝香港官网:Chow Sang Sang(香港及海外配送)
2019/09/05 全球购物
外科实习自我鉴定
2013/10/06 职场文书
毕业生求职自荐信怎么写
2014/01/08 职场文书
小学毕业典礼主持词
2014/03/27 职场文书
广播体操口号
2014/06/18 职场文书
村主任群众路线个人对照检查材料
2014/09/26 职场文书
个人售房合同协议书
2016/03/21 职场文书
深入讲解Vue中父子组件通信与事件触发
2022/03/22 Vue.js