JavaScript、关于元素的offset~和client~

1、偏移量（offset dimension）

 　　=>offsetLeft（元素距离其父元素左边框（/上边框）的距离）

　　=>offsetTop

　　=>offsetWidth（元素的宽度/高度，包括元素的内容、内边距和边框）

　　=>offsetHeight

　　=>offsetParent（元素的父元素）

 

2、客户区的大小（client dimension）

　　=>clientWidth（元素的宽度（/高度），包括元素的内容和内边距）

　　=>clientHeight

注意：浏览器窗口大小可以使用document.documentElement或document.body（在IE7之前的版本中）

function getViewport() {
　　if(document.compatMode == "BackCompat"){
　　　　return {
　　　　　　width: document.body.clientWidth,
　　　　　　height: document.body.clientHeight
　　　　}
　　}else{
　　　　return {
　　　　　　width: document.documentElement.clientWidth,
　　　　　　height: document.documentElement.clientHeight
　　　　}
　　}
}

 

3、滚动大小（scroll dimension）

　　=>scrollHeight（滚动内容的实际宽度（高度），在没有滚动条的条件下，元素内容总高度（/宽度））

　　=>scrollWidth

　　=>scrollLeft（被隐藏在内容区域左侧（/上方）的像素数，通过这个元素可以改变元素的滚动位置）

　　=>scrollTop