js 获取浏览器当前的高度

你可以通过以下代码来获取浏览器当前的高度：

var height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
console.log(height);

其中，`window.innerHeight`获取的是浏览器窗口的高度，`document.documentElement.clientHeight`获取的是文档的可视高度，`document.body.clientHeight`获取的是文档body的高度。三者取其一即可。

相关问题

获取浏览器页面视口高度

获取浏览器页面视口高度可以使用 `document.documentElement.clientHeight` 或 `document.body.clientHeight` 属性。其中，`document.documentElement.clientHeight` 返回当前文档根节点的视口高度，`document.body.clientHeight` 返回当前文档body元素的视口高度。需要注意的是，两者的值可能不同，具体取决于文档内容和CSS样式。一般情况下，建议使用 `document.documentElement.clientHeight`。例如：

var viewportHeight = document.documentElement.clientHeight;
console.log('浏览器页面视口高度：', viewportHeight);

与获取浏览器窗口高度类似，需要注意的是，`document.documentElement.clientHeight` 和 `document.body.clientHeight` 返回的都是一个数值，不包含单位。如果需要添加单位，可以使用 CSS 的 `px` 单位。如果需要在窗口大小变化时更新视口高度，可以监听 `resize` 事件，如下所示：

window.addEventListener('resize', function() {
  var viewportHeight = document.documentElement.clientHeight;
  console.log('浏览器页面视口高度：', viewportHeight);
});

怎么获取当前页面高度

获取当前页面高度也有多种方法，其中一种方法是使用JavaScript的 `document` 对象的 `body` 或 `documentElement` 属性的 `scrollHeight` 或 `clientHeight` 属性来获取当前页面的高度。具体步骤如下：

1. 在JavaScript代码中使用 `document.body.scrollHeight` 或 `document.documentElement.scrollHeight` 来获取当前页面的高度：

const pageHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);

这里使用了 `Math.max` 函数来获取 `body` 和 `documentElement` 的 `scrollHeight` 属性中的最大值，因为有些浏览器中，`body` 和 `documentElement` 的 `scrollHeight` 属性可能不相等，而我们需要获取的是两者之间的最大值。

2. 如果需要获取当前可见部分的页面高度，可以使用 `document.body.clientHeight` 或 `document.documentElement.clientHeight` 来获取：

const visibleHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);

这里同样使用了 `Math.max` 函数来获取 `body` 和 `documentElement` 的 `clientHeight` 属性中的最大值，因为有些浏览器中，`body` 和 `documentElement` 的 `clientHeight` 属性可能不相等，而我们需要获取的是两者之间的最大值。

另外，如果要实时获取页面高度，可以使用 `window` 对象的 `resize` 事件来监听窗口大小的变化，并在事件触发时重新计算页面高度。

例如：

window.addEventListener('resize', function() {
  const pageHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
  const visibleHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
  console.log('当前页面高度为：' + pageHeight);
  console.log('当前可见部分页面高度为：' + visibleHeight);
});

这样在浏览器窗口大小改变时，就会自动更新页面高度并输出到控制台中。