JS获取页面尺寸的方法汇总

通过 JS 获取页面相关的尺寸是比较常见的操作,尤其是在动态计算页面布局时,今天我们将获取页面尺寸的方法做一个汇总,方便以后查阅。

1、获取页面高度

function getPageHeight() {
 var g = document,
  a = g.body,
  f = g.documentElement,
  d = g.compatMode == "BackCompat" ? a : g.documentElement;
 return Math.max(f.scrollHeight, a.scrollHeight, d.clientHeight);
}

2、获取页面scrollLeft

function getPageScrollLeft() {
 var a = document;
 return a.documentElement.scrollLeft || a.body.scrollLeft;
}

3、获取页面scrollTop

function getPageScrollTop() {
 var a = document;
 return a.documentElement.scrollTop || a.body.scrollTop;
}

4、获取页面可视宽度

function getPageViewWidth() {
 var d = document,
  a = d.compatMode == "BackCompat" ? d.body : d.documentElement;
 return a.clientWidth;
}

5、获取页面可视高度

function getPageViewHeight() {
 var d = document,
  a = d.compatMode == "BackCompat" ? d.body : d.documentElement;
 return a.clientHeight;
}

6、获取页面宽度

function getPageWidth() {
 var g = document,
  a = g.body,
  f = g.documentElement,
  d = g.compatMode == "BackCompat" ? a : g.documentElement;
 return Math.max(f.scrollWidth, a.scrollWidth, d.clientWidth);
}

版权声明:本文为老张的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。

原文链接:https://www.webppp.com/view/js_get_widows_size.html