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中圆括号()和方括号[]的特殊用法疑问解答
Aug 06 Javascript
jquery滚动条插件jScrollPane的使用介绍
Nov 08 Javascript
动态加载脚本提升javascript性能
Feb 24 Javascript
JavaScript程序员应该知道的45个实用技巧
Mar 04 Javascript
删除javascript所创建子节点的方法
May 21 Javascript
JS实现弹出居中的模式窗口示例
Jun 20 Javascript
javascript 广告移动特效的实现代码
Jun 25 Javascript
mongoose更新对象的两种方法示例比较
Dec 19 Javascript
小程序的上传文件接口的注意要点解析
Sep 17 Javascript
JavaScript canvas绘制渐变颜色的矩形
Feb 18 Javascript
vue样式穿透 ::v-deep的具体使用
Jun 04 Javascript
JS新手入门数组处理的实用方法汇总
Apr 07 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地址引用(php地址引用的效率问题)
2012/03/23 PHP
PHP常见数组函数用法小结
2016/03/21 PHP
js实现仿百度汽车频道选择汽车图片展示实例
2015/05/06 Javascript
酷炫jQuery全屏3D焦点图动画效果
2016/03/22 Javascript
AngularJs实现分页功能不带省略号的代码
2016/05/30 Javascript
Jquery对新插入的节点 绑定Click事件失效的解决方法
2016/06/02 Javascript
jQuery select自动选中功能实现方法分析
2016/11/28 Javascript
JavaScript 最佳实践:帮你提升代码质量
2016/12/03 Javascript
一步步教你利用Canvas对图片进行处理
2017/09/19 Javascript
vue实现图片滚动的示例代码(类似走马灯效果)
2018/03/03 Javascript
vue生成token并保存到本地存储中
2018/07/17 Javascript
JS/jQuery实现简单的开关灯效果【案例】
2019/02/19 jQuery
解决vue组件中click事件失效的问题
2019/11/09 Javascript
three.js利用卷积法如何实现物体描边效果
2019/11/27 Javascript
精读《Vue3.0 Function API》
2020/05/20 Javascript
[48:24]完美世界DOTA2联赛循环赛LBZS vs Forest 第一场 10月30日
2020/10/31 DOTA
python对配置文件.ini进行增删改查操作的方法示例
2017/07/28 Python
python获取微信小程序手机号并绑定遇到的坑
2018/11/19 Python
对IPython交互模式下的退出方法详解
2019/02/16 Python
pyqt5 删除layout中的所有widget方法
2019/06/25 Python
python3 深浅copy对比详解
2019/08/12 Python
pytorch对梯度进行可视化进行梯度检查教程
2020/02/04 Python
python 调用API接口 获取和解析 Json数据
2020/09/28 Python
python自动从arxiv下载paper的示例代码
2020/12/05 Python
Linux文件操作命令都有哪些
2016/07/23 面试题
音乐学院硕士生的自我评价分享
2013/11/01 职场文书
小学生读书感言
2014/02/12 职场文书
付款委托书范本
2014/04/04 职场文书
大学生党员承诺书
2014/05/20 职场文书
分公司负责人任命书
2014/06/04 职场文书
青春飞扬演讲稿
2014/09/11 职场文书
小学教师节活动总结
2015/03/20 职场文书
现役军人家属慰问信
2015/03/24 职场文书
学生会宣传部竞选稿
2015/11/21 职场文书
2015元旦感言
2015/12/09 职场文书
Python探索生命起源 matplotlib细胞自动机动画演示
2022/04/21 Python