显示器尺寸:screen.height screen.height,是显示器的特性,而不是浏览器的特性。度量:设备的pixel
浏览器内部窗口的大小:window.innerWidth,window.innerHeight。window.innerWidth/Height的值包括滚动条的尺寸,因为它们也被视为窗口内部的一部分。该值是使用css pixels为单位的,需要知道可以将多少数量的元素塞进浏览器窗口中,并且该数量随着用户放大而减少。所以当用户放大显示时,你能获取的浏览器窗口可用空间会减少,并通过window.innerWidth/Height的值的减小来反映出来。
window.pageXOffset, window.pageXOffset:定义了当前页面(document)的相对于窗口原点的水平、垂直位移。因此你能够定位用户滚动了多少的滚动条距离
document.documentElement.clientLeft:获取html元素对象的左边框的宽度。
document.documentElement.clientTop:获取html元素对象的上边框的宽度。
document.documentElement.offsetWidth: 为元素的width+元素的padding+边框的宽度.
document.documentElement.offsetLeft:
- 在父元素均不设置position属性时,在Chrome,opera和IE浏览器中offsetLeft是元素边框外侧到浏览器窗口内侧的距离且body.offsetLeft=0,
- 当父元素设置position元素时又分为两种情况:
- 如果父元素是body且body设置了position属性,在Chrome和opera浏览器中offsetLeft是元素边框外侧到body边框外侧的距离,
- 如果父元素不是body元素且设置了position属性时,offsetLeft为元素边框外侧到父元素边框内侧的距离
document.documentElement.offsetTop: 获取html元素对象相对于整个页面文档的位置
offsetWidth = width + padding + border
document.documentElement.scrollLeft:设置或获取页面文档向右滚动过的像素数。
document.documentElement.scrollTop(取container的值,而不是取被包裹的子元素的值)
scrollHeight:container的border + padding + content
scrollwidth: 元素内容实际宽度,内容不超过盒子宽度时为盒子的 clientWidth