对偏移、卷曲、可视区相关属性的理解
offsetHeight 和 style.height 的区别
demo.style.height只能获取行内样式，如果样式写到了其他地方，甚至根本没写，便无法获取。style.height是字符串（而且带单位），offsetHeight是数值。demo.style.height可以设置行内样式，offsetHeight是只读属性。- 因此，一般用
demo.offsetHeight来获取某元素的真实宽度/高度，用style.height来设置宽度/高度。
offsetLeft 和 style.left 的区别
- 一、
style.left只能获取行内样式。 - 二、
offsetLeft只读，style.left可读可写。 - 三、
offsetLeft是数值，style.left是字符串并且有单位 px。 - 四、如果没有加定位，
style.left获取的数值可能是无效的。 - 五、最大区别在于
offsetLeft以 border 左上角为基准，style.left以 margin 左上角为基准。
scrollHeight 和 scrollWidth
- 标签内部实际内容的高度/宽度。
- 不计算边框，如果内容不超出盒子，值为盒子的宽高（不带边框）。
- 如果内容超出了盒子，就是从顶部或左部边框内侧一直到内容最外部分。
scrollTop 和 scrollLeft
- 被卷去部分的 顶部/左侧 到可视区域 顶部/左侧 的距离。
补充：这一组属性的关系可以总结为：
offset*系列：相对于"定位祖先"或视口的偏移与尺寸；scroll*系列：元素内部被滚动卷去的距离与实际内容尺寸；client*系列（.clientWidth、.clientHeight、.clientTop、.clientLeft）：元素的可见内容尺寸（含 padding 不含 border）。 实际项目中offsetHeight用的最多（兼容性好、无单位），scrollTop常用于"滚动到底部"、"回到顶部"等场景。
