js获取页面及个元素高度、宽度的代码


Posted in Javascript onApril 26, 2016

网页可见区域宽: document.body.clientWidth;
网页可见区域高: document.body.clientHeight;
网页可见区域宽: document.body.offsetWidth (包括边线和滚动条的宽);
网页可见区域高: document.body.offsetHeight (包括边线的宽);
网页正文全文宽: document.body.scrollWidth;
网页正文全文高: document.body.scrollHeight;
网页被卷去的高(ff):document.body.scrollTop;
网页被卷去的高(ie): document.documentElement.scrollTop;
网页被卷去的左:document.body.scrollLeft;
网页正文部分上:window.screenTop;
网页正文部分左:window.screenLeft;
某个元素的宽度:obj.offsetWidth;
某个元素的高度:obj.offsetHeight;
某个元素的上边界到body最顶部的距离:obj.offsetTop;(在元素的包含元素不含滚动条的情况下)
某个元素的左边界到body最左边的距离:obj.offsetLeft;(在元素的包含元素不含滚动条的情况下)
返回当前元素的上边界到它的包含元素的上边界的偏移量:obj.offsetTop(在元素的包含元素含滚动条的情况下)
返回当前元素的左边界到它的包含元素的左边界的偏移量:obj.offsetLeft(在元素的包含元素含滚动条的情况下)

scrollTop, scrollLeft

设置或返回已经滚动到元素的左边界或上边界的像素数。只有在元素有滚动条的时候,例如,元素的 CSS overflow 属性设置为 auto 的时候,这些像素才有用。这些属性也只在文档的 <body> 或 <html> 标记上定义(这和浏览器有关),并且一起来制定滚动文档的位置。注意,这些属性并不会指定一个 <iframe> 标记的滚动量。这是非标准的但却得到很好支持的属性

以上这篇js获取页面及个元素高度、宽度的代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
Feb 27 Javascript
快速解决FusionCharts联动的中文乱码问题
Dec 04 Javascript
$(&quot;&quot;).click与onclick的区别示例介绍
Sep 25 Javascript
JavaScript 异常处理 详解
Feb 06 Javascript
JavaScript中使用自然对数ln的方法
Jun 14 Javascript
实例解析jQuery中proxy()函数的用法
May 24 Javascript
js的各种排序算法实现(总结)
Jul 23 Javascript
ReactNative-JS 调用原生方法实例代码
Oct 08 Javascript
jquery动态创建div与input的实例代码
Oct 12 Javascript
学习JavaScript图片预加载模块
Nov 07 Javascript
详解如何在Vue2中实现组件props双向绑定
Mar 29 Javascript
Vue.js仿Select下拉框效果
Feb 18 Javascript
jQuery javascript获得网页的高度与宽度的实现代码
Apr 26 #Javascript
JQuery给select添加/删除节点的实现代码
Apr 26 #Javascript
js计算时间差代码【包括计算,天,时,分,秒】
Apr 26 #Javascript
js 求时间差的实现代码
Apr 26 #Javascript
Bootstrap表单组件教程详解
Apr 26 #Javascript
AngularJS实现textarea记录只能输入规定数量的字符并显示
Apr 26 #Javascript
50 个 jQuery 插件可将你的网站带到另外一个高度
Apr 26 #Javascript
You might like
PHP 图片水印类代码
2012/08/27 PHP
浅谈php+phpStorm+xdebug配置方法
2015/09/17 PHP
完美解决phpexcel导出到xls文件出现乱码的问题
2016/10/29 PHP
PHP对象、模式与实践之高级特性分析
2016/12/08 PHP
Javascript 学习书 推荐
2009/06/13 Javascript
学习ExtJS TextField常用方法
2009/10/07 Javascript
js下用eval生成JSON对象
2010/09/17 Javascript
简单实用的js调试logger组件实现代码
2010/11/20 Javascript
加速IE的Javascript document输出的方法
2010/12/02 Javascript
使用jQuery实现input数值增量和减量的方法
2015/01/24 Javascript
js实现单击图片放大图片的方法
2015/02/17 Javascript
jQuery支持动态参数将函数绑定到事件上的方法
2015/03/17 Javascript
JS与jQ读取xml文件的方法
2015/12/08 Javascript
SWFUpload多文件上传及文件个数限制的方法
2016/05/31 Javascript
jQuery利用sort对DOM元素进行排序操作
2016/11/07 Javascript
H5移动端图片压缩上传开发流程
2016/11/09 Javascript
谈谈JS中常遇到的浏览器兼容问题和解决方法
2016/12/17 Javascript
vue2.0父子组件及非父子组件之间的通信方法
2017/01/21 Javascript
vue bootstrap小例子一枚
2017/06/09 Javascript
AngularJS基于provider实现全局变量的读取和赋值方法
2017/06/28 Javascript
JavaScript中document.referrer的用法详解
2017/07/04 Javascript
vue做移动端适配最佳解决方案(亲测有效)
2018/09/04 Javascript
微信小程序视图控件与bindtap之间的问题的解决
2019/04/08 Javascript
小程序实现搜索框功能
2020/03/26 Javascript
解决vue打包报错Unexpected token: punc的问题
2020/10/24 Javascript
[40:55]Liquid vs LGD 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python list转矩阵的实例讲解
2018/08/04 Python
Django Form 实时从数据库中获取数据的操作方法
2019/07/25 Python
python检测服务器端口代码实例
2019/08/31 Python
The Hut美国/加拿大:英国领先的豪华在线百货商店
2019/03/26 全球购物
领导班子“四风问题”“整改方案
2014/10/02 职场文书
售房协议书范本2014
2014/10/23 职场文书
开展党的群众路线教育实践活动个人对照检查材料
2014/11/05 职场文书
商场营业员岗位职责
2015/04/14 职场文书
创业计划书之游泳馆
2019/09/16 职场文书
如何vue使用el-table遍历循环表头和表体数据
2022/04/26 Vue.js