偏移量
offsetHeight
offsetWidth
offsetTop
offsetLeft
客户区大小
clientHeight
clientWidth
document.documentElement.clientWidth
或
document.body.clientWidth
(IE7之前)
滚动大小
scrollHeight
scrollWidth
scrollLeft
scrollTop
不包含滚动条的页面不同浏览器的差异(scrollWidth,scrollHeight和clientWidth,clientHeight)
- FF中两组属性始终相等,但大小代表的是文档内容区域的实际尺寸,而非视口大小
- opera,safari和chrome中两组属性有差异,其中scrollWidth和scrollHeight等于视口大小,而clientWidth和clientHeight等于文档内容区域大小
- IE中(标准模式)中的这两组属性不相等,其中scrollWidth和scrollHeight等于文档内容区域大小,而clientWidth和clientHeight等于视口大小
- 确定文档总高度时,必须取得两者间的最大值,才能确保精确
- 非IE
document.documentElement.scrollHeight
document.documentElement.clientHeight
复制代码
- IE
docuemnt.body.scrollHeight
docuemnt.body.clientHeight
复制代码
确定元素大小
rectObject = object.getBoundingClientRect();
返回一个矩形对象,包括
rectObject.top:元素上边到视窗上边的距离;
rectObject.right:元素右边到视窗左边的距离;
rectObject.bottom:元素下边到视窗上边的距离;
rectObject.left:元素左边到视窗左边的距离;
复制代码