Window 大小和滚动

获取窗口的 width/height

document.documentElement.clientWidth/clientHeight
​​​​
不要使用 window.innerWidth/innerHeight 它包含了滚动条的长度

文档的 width/height

获取完整的文档高度（长度）document.documentElement.scrollHeight

获取已滚动的距离

大多数浏览器可以使用document.documentElement.scrollLeft/scrollTop

旧的webkit浏览器需要使用document.body.scrollLeft/scrollTop

使用 window.pageXOffset/pageYOffset(只读) 可以做到兼容

（window.scrollX/scrollY和pageXOffset/pageYOffset是一样的，历史遗留问题）

设置滚动

1.对与当前位置
scrollBy(x,y) 例如，scrollBy(0,10) 会将页面向下滚动 10px。
2.设置绝对位置
scrollTo(pageX,pageY) 等同于设置 scrollLeft/scrollTop

禁止滚动

document.body.style.overflow = “hidden” 用于冻结在当前位置
document.body.style.overflow = “” 恢复滚动

一些属性的区分

• Element.scrollHeight
  只读属性是一个元素内容高度的度量，包括由于溢出导致的视图中不可见内容。
  scrollHeight 的值等于该元素在不使用滚动条的情况下为了适应视口中所用内容所需的最小高度。高度的度量方式与 clientHeight 相同：包括元素的内边距，但不包括元素的边框、外边距以及水平滚动条（如果存在）。它也包括 ::before 和 ::after 这样的伪元素的高度。如果元素的内容不需要垂直滚动条就可以容纳，则其 scrollHeight 等于 clientHeight。
• Element.clientHeight
  只读属性, 对于没有定义 CSS 或者内联布局盒子的元素为 0；否则，它是元素内部的高度（以像素为单位），包含内边距，但不包括边框、外边距和水平滚动条（如果存在）。
  clientHeight 可以通过 CSS height + CSS padding - 水平滚动条高度（如果存在）来计算。
  在根元素（html元素）或怪异模式下的body元素上使用 clientHeight 时，该属性将返回视口高度（不包含任何滚动条）。这是一个 clientHeight 的特例。
• HTMLElement.offsetHeight
  只读属性，它返回该元素的像素高度，高度包含该元素的垂直内边距和边框，且是一个整数。
  通常，元素的 offsetHeight 是一种元素 CSS 高度的衡量标准，包括元素的边框、内边距和元素的水平滚动条（如果存在且渲染的话），不包含:before 或:after 等伪类元素的高度。
  如果元素被隐藏（例如 元素或者元素的祖先之一的元素的 style.display 被设置为 none），则返回 0