获取浏览器窗口宽高和浏览器滚动条宽高

最新推荐文章于 2024-04-15 01:16:29 发布

原创最新推荐文章于 2024-04-15 01:16:29 发布 · 364 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #获取浏览器宽高

前端同时被 2 个专栏收录

36 篇文章

订阅专栏

笔记

1 篇文章

订阅专栏

本文介绍如何使用JavaScript获取浏览器窗口的宽高，以及如何兼容不同浏览器获取滚动条的宽度和高度。通过document.documentElement.clientWidth和document.documentElement.clientHeight可以获取浏览器的宽度和高度，而通过document.documentElement.scrollTop或document.body.scrollTop可以获取页面的垂直滚动距离。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、浏览器宽高

document.documentElement.clientWidth;

document.documentElement.clientHeihgt;

2、获取浏览器滚动条宽度/高度显示的数值是页面上方滚上去的隐藏的内容的数值

            var iScrollTop = document.documentElement.scrollTop ||document.body.scrollTop;
                iScrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
            console.log(iScrollTop);
            console.log(iScrollLeft);

这考虑了浏览器之间的兼容性