Sekyoro的博客小屋
·
浏览器JS
内容提要
本文介绍了浏览器常用的JavaScript方法，包括获取元素尺寸属性和与其他元素的距离，如可视部分尺寸、占据尺寸、滚动尺寸等。还介绍了获取可视区域、滚动条距离、屏幕分辨率、浏览器尺寸等方法。最后提到了获取矩形元素界线和滚动到可视区域的方法。
关键要点
-
本文介绍了浏览器常用的JavaScript方法，主要涉及元素的尺寸属性和与其他元素的距离。
-
获取元素尺寸属性包括clientWidth、clientHeight、offsetWidth、offsetHeight、scrollWidth和scrollHeight等。
-
clientWidth和clientHeight获取元素可视部分的宽度和高度，不包括边框和滚动条。
-
offsetWidth和offsetHeight获取元素在页面中占据的总宽度和高度，包括边框和滚动条。
-
scrollWidth和scrollHeight获取元素的总宽度和高度，适用于overflow:visible样式。
-
获取可视区域的宽高可以使用document.documentElement.clientWidth和clientHeight，但在老IE浏览器上不适用。
-
获取滚动条距离的方法为document.body.scrollTop或document.documentElement.scrollTop。
-
屏幕分辨率可以通过window.screen.height和window.screen.width获取，工作区域的宽高通过availHeight和availWidth获取。
-
浏览器的宽高可以通过window.outerHeight和window.outerWidth获取，innerHeight和innerWidth不包括工具栏。
-
getBoundingClientRect()方法获取矩形元素的界线，scrollIntoView()方法让元素滚动到可视区域。
