js中一些关于尺寸和位置的东西

原生
offset

offsetWidth和offsetHeight

怎么获取元素占据的空间大小 width + padding + border
css(div,'width');只能获取元素的宽度（不包含padding、border）
元素.offsetWidth 元素占据的宽度 width + padding + border
元素.offsetHeight 元素占据的高度 height + padding + border

offsetLeft、offsetTop、offsetParent

1、offsetLeft 元素相对于第一个使用定位元素的左边的距离

2、offsetTop 元素相对于第一个使用定位元素的上边距离

3、offsetParent 第一个使用定位的父级元素(如果没有就是body)

当有滚动条时：
var sTop = document.documentElement.scrollTop||document.body.scrollTop
获取滑动的高度
var cHeight = document.documentElement.clientHeight||document.body.clientHeight;
获取显示高度

事件对象
offsetX、offsetY、clientX、clientY、pageX、pageY、screenX、screenY

offsetX、offsetY:
鼠标相对于事件源元素（srcElement）的X,Y坐标
clientX、clientY:
鼠标相对于浏览器窗口可视区域的X，Y坐标（窗口坐标），可视区域不包括工具栏和滚动条。
pageX、pagey:
类似于event.clientX、event.clientY，但它们使用的是文档坐标而非窗口坐标。这2个属性不是标准属性，但得到了
广泛支持。IE事件中没有这2个属性
screenX、screenY:
鼠标相对于用户显示器屏幕左上角的X,Y坐标。

 

jquery:

height 取得匹配元素当前计算的高度值（px）。
$("p").height();

width 取得第一个匹配元素当前计算的宽度值（px）。
$("p").width();

innerHeight() 获取第一个匹配元素内部区域高度（包括补白、不包括边框）。
$("p").innerHeight();

innerWidth() 获取第一个匹配元素内部区域宽度（包括补白、不包括边框）。
$("p").innerWidth();

outerHeight() 获取第一个匹配元素外部高度（默认包括补白和边框）。
$("p").outerHeight();

outerWidth() 获取第一个匹配元素外部宽度（默认包括补白和边框）。
$("p").outerWidth();

offset 获取匹配元素在当前文档的相对偏移。
$("#box").offset().left;
$("#box").offset().top;

position 获取匹配元素相对父元素的偏移。（有定位时）
$("#box").position().left;
$("#box").position().top;

scrollTop 获取匹配元素相对滚动条顶部的偏移。
$("p").scrollTop();

scrollLeft 获取匹配元素相对滚动条左侧的偏移。
$("p").scrollLeft();