offset...、client...、scroll.. 这三类属性的问题，总是混淆，现归纳总结如下：
大体上我是这样理解的：
1.client...属性（clientWidth、clientHeight）：
表示元素可以看到内容的可见区域部分，它会直接返回属性的数值大小，可直接进行计算。
分开说的话也可以这样理解：若元素大小小于父元素，大小包括padding、content部分，不包括border； 若元素大小大于父元素，则表示可以看到的部分的高或宽。
2.offset...属性（offsetWidth、offsetHeight、offsetTop、offsetLeft）：
对于offsetWidth和offsetHeight，都表示当前对象的宽度/高度。offsetWidth与style.widtht的区别是：
若对象的宽度设定值为百分百宽度，无论页面变大或变小，style.width都返回此百分比；而offsetWidth则返回页面中对象的宽度值而不是百分比。
3.scroll..属性（scrollTop、scrollLeft、scrollHeight、scrollWidth）：
scrollWidth、scrollHeight属性代表元素对象真实的宽高，即使有一部分看不到。