JavaScript 获取页面滚动条位置与尺寸的函数实现

作者:异步漫步时间:2026-10-23 23:31:51浏览:461

本文介绍如何使用 JavaScript 获取当前页面的滚动条位置(垂直和水平)以及页面的总宽度和高度。代码兼容标准模式和怪异模式,通过判断 document.documentElement 和 document.body 的属性来确保在不同浏览器环境下都能正确获取滚动信息,返回包含 t, l, w, h 的对象。

JavaScript 获取页面滚动条位置与尺寸的函数实现

该功能代码此前已在“用 Javascript 实现锚点(Anchor)间平滑跳转”一文中提及,鉴于其在实际开发中的高频使用场景,此处单独整理发布,以便读者查阅和引用。


具体实现代码如下:

<script type="text/javascript">
// 说明:用 Javascript 获取滚动条位置等信息
// 来源 :ThickBox 2.1
function getScroll()
{ 
var t, l, w, h;
if (document.documentElement && document.documentElement.scrollTop) {
t = document.documentElement.scrollTop;
l = document.documentElement.scrollLeft;
w = document.documentElement.scrollWidth;
h = document.documentElement.scrollHeight;
} else if (document.body) {
t = document.body.scrollTop;
l = document.body.scrollLeft;
w = document.body.scrollWidth;
h = document.body.scrollHeight;
} 
return { t: t, l: l, w: w, h: h };
} 
</script>
作者最新文章