DOM常用的属性

offsetHeight height+padding+border,当前对象的高度

clientHeight 获取对象可视高度,不包括滚动条,不包括边框
scrollHeight 获取对象的滚动高度/内容总高度

offsetWidth

clientWidth

scrollWidth

offsetTop 当前对象相对于定位父级的top值
clientTop 获取对象上边框的border高度
scrollTop 滚动上去的那一部分,设置给能够滚动的元素。不能滚动的元素,scrollTop为0

offsetLeft

clientLeft

scrollLeft


【利用scrollTop属性,可以实现网页的“回到顶部”的小效果,下篇博文会加以详细说明,需要的小伙伴,可以抽空过来看看~DOM常用的属性


窗口宽度
window.innerWidth 不包含工具栏、控制台
window.outerWidth 包含工具栏、控制台

window.innerHeight

window.outerHeight


这些属性的好处是:用着比较方便,是属于只读属性,不带有单位“px”,省掉了特殊的场景需要去除单位的麻烦。

最后,引用一张很火的图,具体是谁的图,我已经不知道了,感谢~~~DOM常用的属性

DOM常用的属性