JS可以通过多种方式获取窗口高度，本文将从多个方面分析JS获取窗口高度的方法，并提供对应的代码示例。
一、JS获取窗口大小
JS可以使用window对象的innerWidth和innerHeight属性获取窗口大小。
window.innerWidth; // 获取窗口的宽度
window.innerHeight; // 获取窗口的高度
这种方法获取到的窗口大小包括窗口滚动条、工具条等的大小。
二、JS获取浏览器打开的窗口
JS可以使用window对象的outerWidth和outerHeight属性获取浏览器打开的窗口大小。
window.outerWidth; // 获取浏览器打开的窗口宽度
window.outerHeight; // 获取浏览器打开的窗口高度
这种方法获取到的窗口大小不包括窗口滚动条、工具条等的大小。
三、JS获取窗口宽度
JS可以使用document对象的documentElement.clientWidth属性或body元素的clientWidth属性获取窗口宽度。
document.documentElement.clientWidth; //获取窗口宽度
document.body.clientWidth; //获取窗口宽度
这种方法获取到的窗口宽度不包括窗口滚动条的宽度。
四、JS获取当前窗口宽度
JS可以使用document对象的documentElement.offsetWidth属性或body元素的offsetWidth属性获取当前窗口宽度。
document.documentElement.offsetWidth; //获取当前窗口宽度
document.body.offsetWidth; //获取当前窗口宽度
这种方法获取到的窗口宽度包括窗口滚动条的宽度。
五、JS获取窗口的宽高
JS可以使用document对象的documentElement.scrollWidth和documentElement.scrollHeight属性获取窗口的宽高。
document.documentElement.scrollWidth; //获取窗口的宽度
document.documentElement.scrollHeight; //获取窗口的高度
这种方法获取到的窗口大小包括窗口滚动条、工具条等的大小。
六、JS获取浏览器窗口大小
JS可以使用document对象的documentElement.offsetWidth和documentElement.scrollHeight属性获取浏览器窗口大小。
document.documentElement.offsetWidth; //获取浏览器窗口宽度
document.documentElement.scrollHeight; //获取浏览器窗口高度
这种方法获取到的窗口大小包括窗口滚动条、工具条等的大小。
七、JS获取当前窗口的高度
JS可以使用document对象的documentElement.offsetHeight属性或body元素的offsetHeight属性获取当前窗口的高度。
document.documentElement.offsetHeight; //获取当前窗口的高度
document.body.offsetHeight; //获取当前窗口的高度
这种方法获取到的窗口大小包括窗口滚动条和工具条的大小。
八、JS获取浏览器窗口宽度
JS可以使用document对象的documentElement.clientWidth属性获取浏览器窗口宽度。
document.documentElement.clientWidth; //获取浏览器窗口宽度
这种方法获取到的窗口宽度不包括窗口滚动条的宽度。
九、JS获取的视口宽度
JS可以使用document对象的documentElement.clientWidth和window对象的innerWidth属性获取视口宽度。
//获取视口宽度
Math.min(document.documentElement.clientWidth, window.innerWidth);
这种方法获取到的视口宽度不包括窗口滚动条的宽度。
总结
本文介绍了JS获取窗口高度的多种方法，每种方法都有其适用场景。根据实际需求选择合适的方法可以方便快捷地获取到窗口高度。
