js中常见宽度高度分析

element.clientHeight	返回元素的可见高度。
element.clientWidth	返回元素的可见宽度。

element.offsetHeight	返回元素的高度。
element.offsetWidth	返回元素的宽度。
element.offsetLeft	返回元素的水平偏移位置。
element.offsetParent	返回元素的偏移容器。
element.offsetTop	返回元素的垂直偏移位置。

element.scrollHeight	返回元素的整体高度。
element.scrollLeft	返回元素左边缘与视图之间的距离。
element.scrollTop	返回元素上边缘与视图之间的距离。
element.scrollWidth	返回元素的整体宽度。

个人分析：

1.client：一开始在w3c上查完之后我还纠结什么是可见高度，后来自己试验之后才知道所谓可见高度就是元素去掉border之后的宽度，具体即为content+padding，假如元素已经超出当前屏幕可见高度，仍旧返回当前可见，并非原本高度。

2.offset：返回元素的高度即为content+padding+border

3.scroll：说到这个磨人的小妖精我就不能淡定了，因为大狼在试验的时候用的是刚刚做的那个鼠标hover上去遮罩就会划上去的动效，所以遮罩有一部分是overflow hidden调掉的，所以他是整体高度就不止是他本事的高度而是包含了hidden掉的部分高度，因此他是指包含本事及其子元素的所有高度宽度~~~content+padding+childenSize以上是scrollHeight和scrollwidth，接下来是scrollLeft和scrollTop这俩只有当元素本身有滚动条时才有意义，分别是下滚动条距左边距离和右滚动条距上边距离

既然说到这里，就把获取当前屏幕高度也一并看了，获取当前屏幕的对象是screen对象

1.当前屏幕高度：screen.height

2.当前屏幕宽度：screen.width