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 相关文章推荐
js的flv视频播放器插件使用方法
Jun 23 Javascript
浅谈JavaScript for循环 闭包
Jun 22 Javascript
JSONP跨域请求实例详解
Jul 04 Javascript
JS和canvas实现俄罗斯方块
Mar 14 Javascript
Vue中img的src属性绑定与static文件夹实例
May 18 Javascript
JS实现的按钮点击颜色切换功能示例
Oct 19 Javascript
安装Node.js并启动本地服务的操作教程
May 12 Javascript
利用angular自动编译andriod APK的绕坑经历分享
Mar 08 Javascript
angularjs模态框的使用代码实例
Dec 20 Javascript
如何利用javascript接收json信息并进行处理
Aug 06 Javascript
jQuery实现简单评论功能
Aug 19 jQuery
微信小程序实现首页弹出广告
Dec 03 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
解决MySQL中文输出变成问号的问题
2008/06/05 PHP
用PHP程序实现支持页面后退的两种方法
2008/06/30 PHP
php实现模拟登陆方正教务系统抓取课表
2015/05/19 PHP
Zend Framework教程之模型Model用法简单实例
2016/03/04 PHP
深入理解PHP的远程多会话调试
2017/09/21 PHP
Firefox getBoxObjectFor getBoundingClientRect联系
2008/10/26 Javascript
JavaScript NaN和Infinity特殊值 [译]
2012/09/20 Javascript
javascript中的绑定与解绑函数应用示例
2013/06/24 Javascript
js二维数组排序的简单示例代码
2014/01/24 Javascript
将中国标准时间转换成标准格式的代码
2014/03/20 Javascript
JavaScript中pop()方法的使用教程
2015/06/09 Javascript
Javascript刷新窗口方法小结
2015/10/21 Javascript
谈谈AngularJs中的隐藏和显示
2015/12/09 Javascript
jQuery实现动态生成表格并为行绑定单击变色动作的方法
2017/04/17 jQuery
详解Vue路由钩子及应用场景(小结)
2017/11/07 Javascript
vue中添加mp3音频文件的方法
2018/03/02 Javascript
Vue实现按钮级权限方案
2019/11/21 Javascript
详解JavaScript 作用域
2020/07/14 Javascript
[05:42]DOTA2英雄梦之声_第10期_蝙蝠骑士
2014/06/21 DOTA
Python读写配置文件的方法
2015/06/03 Python
python3 selenium 切换窗口的几种方法小结
2018/05/21 Python
使用TensorFlow实现二分类的方法示例
2019/02/05 Python
Python-opencv实现红绿两色识别操作
2020/06/04 Python
Django使用django-simple-captcha做验证码的实现示例
2021/01/07 Python
基于HTML5的齿轮动画特效
2016/02/29 HTML / CSS
ONLY德国官方在线商店:购买时尚女装
2017/09/21 全球购物
德国家用电器购物网站:Premiumshop24
2019/08/22 全球购物
怎样比较两个类型为String的字符串
2016/08/17 面试题
存储过程和sql语句的优缺点
2014/07/02 面试题
法学个人求职信范文
2014/01/27 职场文书
大学自主招生自荐信范文
2014/02/26 职场文书
董事长助理工作职责范本
2014/07/01 职场文书
加强机关作风建设心得体会
2014/10/22 职场文书
单身申明具结书
2015/02/26 职场文书
成事在人观后感
2015/06/16 职场文书
码云(gitee)通过git自动同步到阿里云服务器
2022/12/24 Servers