博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
body元素对象的clientWidth、offsetWidth、scrollWidth、clientLeft、offsetLeft、scrollLeft
阅读量:7019 次
发布时间:2019-06-28

本文共 1466 字,大约阅读时间需要 4 分钟。

document.body.clientWidth 获取body元素对象的内容可视区域的宽度,即clientWidth=width+padding,不包括滚动条。

document.body.clientHeight 获取body元素对象的内容可视区域的高度,即clientHeight=height+padding,不包括滚动条。

浏览器兼容性 在IE7中,如果给body设置滚动条的话,滚动条是出现在body内部的。所以当给body设置width和height时,在IE7中clientWidth和clientHeight的值是要比其它浏览器中的值小一些的。

document.body.offsetWidth 获取body元素对象的宽度,即offsetWidth=width+padding+border,也可以写成offsetWidth=clientWidth+border。

document.body.offsetHeight 获取body元素对象的高度,即offsetHeight=height+padding+border,也可以写成offsetHeight=clientHeight+border。

浏览器兼容性 在IE7中,如果给body设置滚动条的话,滚动条是出现在body内部的。所以offsetWidth和offsetHeight的值还需要加上滚动条的宽度。当然最终的值和其它浏览器是一样的。

document.body.scrollWidth 获取body元素对象内容的实际宽度,即对象的滚动宽度。

document.body.scrollHeight 获取body元素对象内容的实际高度,即对象的滚动高度。 浏览器兼容性 在FireFox和IE中,其获取的就是body元素对象内部内容的实际宽高。 在Chrome、Safari、Opera中,scrollWidth和scrollHeight获取的是整个页面文档的滚动宽高。

document.body.clientLeft 获取body元素对象的左边框的宽度。

document.body.clientTop 获取body元素对象的上边框的宽度。 浏览器兼容性 各浏览器表现一致。

document.body.offsetLeft 获取body元素对象相对于自身的位置。

document.body.offsetTop 获取body元素对象相对于自身的位置。 浏览器兼容性 在Chrome、Opera、Safari、IE8、IE9和IE10中,工作正常,offsetLeft和offsetTop的值都为0。 在FireFox中,offsetLeft和offsetTop的值为负的body元素的border-width。 在IE7中,offsetLeft和offsetTop指的是body元素对象的边框(不包括边框)到页面文档边缘的距离。

document.body.scrollLeft 获取页面文档向右滚动过的像素数。

document.body.scrollTop 获取页面文档向下滚动过的像素数。 浏览器兼容性 在FireFox、IE8、IE9和IE10中,scrollLeft和scrollTop的值始终为0。 在IE7中,scrollLeft和scrollTop的值为body元素对象最顶端和对象内容的最顶端之间的距离,即滚动条滚过的距离。

转载于:https://www.cnblogs.com/wpTing/p/10613717.html

你可能感兴趣的文章
初始化参数(Initialization Parameter)知识合集 based on 11g
查看>>
opencv中 Mat矩阵申明形式
查看>>
C++三大特性之继承
查看>>
FragmentTransaction的add(),replace(),以及show(),hide()
查看>>
mysql 1093 错误
查看>>
Codeforces 442B
查看>>
JMeter接口测试系列-关联参数
查看>>
Linux Shell常用快捷键
查看>>
Oracle sql 优化の索引监控
查看>>
通过日期获取日期所在年的周数
查看>>
培训班出身的程序员为什么遭人嫌弃
查看>>
vue中的 ref 和 $refs
查看>>
linux查看网络流量
查看>>
Sqli-labs less 34
查看>>
[转]DPM2012系列之十二:还原exchange2010用户邮件
查看>>
vue项目安装步骤
查看>>
Python编程-基础知识-字符串格式化
查看>>
Oracle 维护数据的完整性 一 约束
查看>>
【“零起点”--百度地图手机SDK】如何查询从西单到王府井的公交导航?
查看>>
Newtonsoft.Json高级用法
查看>>