HTML 元素尺寸和滚动尺寸等笔记

• offsetWidth 元素的布局宽度（元素宽度 width + padding + border + 滚动条宽度 ），整数，单位像素，只读。

• clientWidth 元素的内部宽度（元素宽度 width + padding），整数，单位像素，只读。内联元素以及没有 CSS 样式的元素该属性值为 0。

• scrollWidth 元素所有内容所需的最小宽度（元素宽度 width + padding）。如果不需要水平滚动条，值等于 clientWidth。

• scrollLeft 元素相对于左边滚动的距离，有可能是小数，单位像素，可读写。

• offsetLeft 元素左上角相对于最近的父级定位元素（若没有，则为 body）左边界的距离，整数，单位像素，只读。

如果要获取小数值，可以使用 getBoundingClientRect() 方法，它包括 left，top，right，bottom，x，y，width 和 height 几个属性，除了 width 和 height 以外的属性是相对于视图窗口的左上角来计算的。如果要获得相对于整个网页左上角定位的属性值，那么只要给 top、left 属性值加上当前的滚动位置（通过 window.scrollX 和 window.scrollY），这样就可以获取与当前的滚动位置无关的值。

如果需要更好的跨浏览器兼容性，请使用 window.pageXOffset 和 window.pageYOffset 代替 window.scrollX 和 window.scrollY。