JS:body元素对象的clientWidth、offsetWidth、scrollWidth、clientLeft、offsetLeft、scrollLeft
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元素对象最顶端和对象内容的最顶端之间的距离,即滚动条滚过的距离。
JS:body元素对象的clientWidth、offsetWidth、scrollWidth、clientLeft、offsetLeft、scrollLeft的更多相关文章
- 一文看懂js中元素的滚动大小(scrollWidth,scrollHeight,scrollTop,scrollLeft)
滚动大小(scroll dimension) 滚动大小指的是包含滚动内容元素的大小. 以下是与元素滚动内容大小相关的属性: 1. scrollWidth:在没有滚动条的情况下,元素内容的总宽度. 2. ...
- clientWidth,offsetWidth,scrollWidth区别
<html> <head> <title>clientWidth,offsetWidth,scrollWidth区别</title> </head ...
- JQuery中width和JS中JS中关于clientWidth offsetWidth scrollWidth 等的含义
JQuery中: width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度: outerWidth()方法用于获得包括内边界(padding)和 ...
- JS中关于clientWidth offsetWidth scrollWidth 等的含义
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...
- js中的clientWidth offsetWidth scrollWidth等的含义
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...
- JS中关于clientWidth offsetWidth scrollWidth 的区别及意义
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...
- JS中关于clientWidth offsetWidth scrollWidth 等的含义的详细介绍
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...
- clientWidth offsetWidth scrollWidth
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...
- js的元素对象
元素对象(element对象) ** 要操作element对象,首先必须要获取到element, - 使用document里面相应的方法获取 ...
随机推荐
- python 面试题: 列表表达式
[process() for item1 in iterable1 if condition1 for item2 in iterable2 if condition2 For item3 in it ...
- HDU 4436 str2int(后缀自动机)(2012 Asia Tianjin Regional Contest)
Problem Description In this problem, you are given several strings that contain only digits from '0' ...
- Z.XML-Cocos2d-x开发笔记
大家都在热火朝天的使用Cocos2d-x引擎做游戏开发,那么大家不妨把过程中解决的关键问题记录在这里,做一个分享! 1.在Android平台下打开网页 1.1修改项目工程源文件 在你的项目工程源文件中 ...
- Object类中的五种方法
clone() Object类源码:protected native Object clone() throws CloneNotSupportedException; 这里有个问题:为什么Sun公司 ...
- Extjs的API阅读方式(整理)
原文链接:http://www.cnblogs.com/gaojun/archive/2013/05/28/3103908.html
- [剑指Offer] 6.旋转数组的最小数字(二分法)
题目描述 把一个数组最开始的若干个元素搬到数组的末尾,我们称之为数组的旋转.输入一个非递减排序的数组的一个旋转,输出旋转数组的最小元素.例如数组{3,4,5,1,2}为{1,2,3,4,5}的一个旋转 ...
- JSP表单提交出现中文乱码的解决方法
1)post方式 在servlet的doGet( ) doPost( ) 中增加以下代码: response.setContentType("text/html;charset=utf- ...
- mac --snip 滚动截屏
1.snip 下载配置:https://jingyan.baidu.com/article/fec4bce2458d03f2618d8b8e.html 2.mac的火狐浏览器好像不支持,必须在sofa ...
- Augmenting Path Algorithm : 一般图最大匹配
算法原理详见 http://www.csie.ntnu.edu.tw/~u91029/Matching.html orz 带花树很神奇,挖坑最大权匹配 #include <iostream> ...
- [CF107D]Crime Management
题目大意:有一种长度为$n(n\leqslant 10^{18})$的字符串,给定$m(m\leqslant10^3)$种限制,即字符$c$出现的次数为$cnt$,若一个字符有多种限制,则满足任意一个 ...