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 相关文章推荐
麻雀虽小五脏俱全 Dojo自定义控件应用
Sep 04 Javascript
jQuery之过滤元素操作小结
Nov 30 Javascript
全面解析Bootstrap弹窗的实现方法
Dec 01 Javascript
Bootstrap+jfinal实现省市级联下拉菜单
May 30 Javascript
angular源码学习第一篇 setupModuleLoader方法
Oct 20 Javascript
javascript-解决mongoose数据查询的异步操作
Dec 22 Javascript
JS实现简易刻度时钟示例代码
Mar 11 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
Mar 29 Javascript
vue-cli如何引入bootstrap工具的方法
Oct 19 Javascript
js定时器实现倒计时效果
Nov 05 Javascript
JS实现打砖块游戏
Feb 14 Javascript
selenium 反爬虫之跳过淘宝滑块验证功能的实现代码
Aug 27 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实现页面静态化的超简单方法
2016/09/06 PHP
PHP中功能强大却很少使用的函数实例小结
2016/11/10 PHP
PHP获取类私有属性的3种方法
2020/09/10 PHP
Domino中运用jQuery读取视图内容的方法
2009/10/21 Javascript
jQuery实现原理的模拟代码 -6 代码下载
2010/08/16 Javascript
情人节专属 纯js脚本1k大小的3D玫瑰效果
2012/02/11 Javascript
JavaScript 上万关键字瞬间匹配实现代码
2013/07/07 Javascript
JQuery加载图片自适应固定大小的DIV
2013/09/12 Javascript
iframe子页面获取父页面元素的方法
2013/11/05 Javascript
jquery xMarquee实现文字水平无缝滚动效果
2014/04/29 Javascript
node.js中的socket.io的广播消息
2014/12/15 Javascript
浅谈js里面的InttoStr和StrtoInt
2016/06/14 Javascript
javascript iframe跨域详解
2016/10/26 Javascript
利用浮层使select不可选的实现方法
2016/12/03 Javascript
JS实现留言板功能
2017/06/17 Javascript
详解require.js配置路径的用法和css的引入
2017/09/06 Javascript
Vue项目部署的实现(阿里云+Nginx代理+PM2)
2019/03/26 Javascript
浅谈Vue项目骨架屏注入实践
2019/08/05 Javascript
详解Vue的watch中的immediate与watch是什么意思
2019/12/30 Javascript
详解微信小程序轨迹回放实现及遇到的坑
2021/02/02 Javascript
浅析Python中的多重继承
2015/04/28 Python
Python的Bottle框架中返回静态文件和JSON对象的方法
2015/04/30 Python
python一行sql太长折成多行并且有多个参数的方法
2018/07/19 Python
Python爬虫实战之12306抢票开源
2019/01/24 Python
Python将列表数据写入文件(txt, csv,excel)
2019/04/03 Python
python利用google翻译方法实例(翻译字幕文件)
2020/09/21 Python
Python __slots__的使用方法
2020/11/15 Python
用60行代码实现Python自动抢微信红包
2021/02/04 Python
html svg生成环形进度条的实现方法
2019/09/23 HTML / CSS
公司领导推荐信
2013/11/12 职场文书
历史专业个人求职信范文
2013/12/07 职场文书
会计岗位职责模板
2014/03/12 职场文书
《郑和远航》教学反思
2014/04/16 职场文书
经理任命书模板
2014/06/06 职场文书
2014年秋季开学典礼致辞
2014/08/02 职场文书
小学优秀教师材料
2014/12/15 职场文书