js获取浏览器的各种属性


Posted in Javascript onApril 27, 2017

网页可见区域宽: 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;

scrollHeight: 获取对象的滚动高度。 

scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离

scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离

scrollWidth:获取对象的滚动宽度

offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度

offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置

offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 

event.clientX 相对文档的水平座标

event.clientY 相对文档的垂直座标

event.offsetX 相对容器的水平坐标

event.offsetY 相对容器的垂直坐标 

document.documentElement.scrollTop 垂直方向滚动的值

event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

要获取当前页面的滚动条纵坐标位置,用:

document.documentElement.scrollTop;

而不是:

document.body.scrollTop;

documentElement 对应的是 html 标签,而 body 对应的是 body 标签

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
javascript实现 在光标处插入指定内容
May 25 Javascript
禁止js文件缓存的代码
Apr 09 Javascript
jQuery 1.8 Release版本发布了
Aug 14 Javascript
关于JS判断图片是否加载完成且获取图片宽度的方法
Apr 09 Javascript
每天一篇javascript学习小结(Boolean对象)
Nov 12 Javascript
理解javascript中的严格模式
Feb 01 Javascript
canvas实现图像截取功能
Feb 06 Javascript
js实现点击图片在屏幕中间弹出放大效果
Sep 11 Javascript
three.js利用gpu选取物体并计算交点位置的方法示例
Nov 25 Javascript
JavaScript canvas实现雪花随机动态飘落
Feb 08 Javascript
javascript设计模式 ? 单例模式原理与应用实例分析
Apr 09 Javascript
vue element 关闭当前tab 跳转到上一路由操作
Jul 22 Javascript
jQuery鼠标悬停内容动画切换效果
Apr 27 #jQuery
详解axios在node.js中的post使用
Apr 27 #Javascript
使用jQuery,Angular实现登录界面验证码详解
Apr 27 #jQuery
js绑定事件和解绑事件
Apr 27 #Javascript
详解ECMAScript6入门--Class对象
Apr 27 #Javascript
利用Vue v-model实现一个自定义的表单组件
Apr 27 #Javascript
详解Vue 普通对象数据更新与 file 对象数据更新
Apr 26 #Javascript
You might like
PHP empty函数报错解决办法
2014/03/06 PHP
PHP获取Exif缩略图的方法
2015/07/13 PHP
Zend Framework实现多服务器共享SESSION数据的方法
2016/03/22 PHP
php自定义函数实现JS的escape的方法示例
2016/07/07 PHP
PHP+JQuery+Ajax实现分页方法详解
2016/08/06 PHP
thinkphp中的多表关联查询的实例详解
2017/10/12 PHP
11款新鲜的jQuery插件[附所有demo下载]
2011/01/24 Javascript
学习javascript,实现插入排序实现代码
2011/07/31 Javascript
java与javascript之间json格式数据互转介绍
2013/10/29 Javascript
JavaScript的strict模式与with关键字介绍
2014/02/08 Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
2015/04/12 Javascript
jQuery超精致图片轮播幻灯片特效代码分享
2015/09/10 Javascript
AngularJS基础 ng-include 指令示例讲解
2016/08/01 Javascript
angularJS 指令封装回到顶部示例详解
2017/01/22 Javascript
js仿新浪微博消息发布功能
2017/02/17 Javascript
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
2017/03/22 jQuery
Vue.js中对css的操作(修改)具体方式详解
2018/10/30 Javascript
小程序使用wxs解决wxml保留2位小数问题
2019/12/13 Javascript
javascript使用正则表达式实现注册登入校验
2020/09/23 Javascript
Python 文件和输入输出小结
2013/10/09 Python
解读Django框架中的低层次缓存API
2015/07/24 Python
Python实现base64编码的图片保存到本地功能示例
2018/06/22 Python
Python使用ctypes调用C/C++的方法
2019/01/29 Python
python基于itchat模块实现微信防撤回
2019/04/29 Python
python实现的批量分析xml标签中各个类别个数功能示例
2019/12/30 Python
在主流系统之上安装Pygame的方法
2020/05/20 Python
abstract class和interface有什么区别
2013/08/04 面试题
最热门的自我评价
2013/12/30 职场文书
优秀学生干部推荐材料
2014/02/03 职场文书
应聘编辑自荐信范文
2014/03/12 职场文书
优秀共产党员演讲稿
2014/09/04 职场文书
班子群众路线教育实践个人对照检查材料思想汇报
2014/09/30 职场文书
违反纪律检讨书范文
2015/05/07 职场文书
家装电话营销开场白
2015/05/29 职场文书
公司转让协议书
2016/03/19 职场文书
一文教你快速生成MySQL数据库关系图
2022/06/28 Redis