window.innerHeight的IE8替代方案

在前端开发中，获取浏览器窗口高度是一个非常常见的任务。window.innerHeight是一个非常便利的API，它可以用于获取可视区域的高度，但是它不适用于IE8及以下版本的浏览器。

为什么window.innerHeight不兼容IE8？

window.innerHeight是W3C标准的一部分，它被定义为浏览器窗口可视区域的高度。然而，IE8及以下版本的浏览器并没有实现这个标准。

IE8下获取可视区域高度的替代方案

虽然window.innerHeight在IE8下不可用，但我们可以使用其他方法来获取浏览器窗口的可视区域高度。下面是一些常见的替代方案：

document.documentElement.clientHeight

在IE8及以下版本的浏览器中，我们可以使用document.documentElement.clientHeight来获取浏览器窗口的可视区域高度。这个属性返回文档根元素的高度，也就是浏览器窗口除去工具栏和滚动条后的可见部分。

function getWindowHeight() {
  return window.innerHeight || document.documentElement.clientHeight;
}

document.body.clientHeight

如果你的页面没有设置DOCTYPE，那么你可以使用document.body.clientHeight来获取可视区域高度。这个属性返回body元素的高度。

function getWindowHeight() {
  return window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
}

jQuery方法

如果你正在使用jQuery，那么可以使用$(window).height()来获取可视区域高度。

function getWindowHeight() {
  return $(window).height();
}

总结

在IE8及以下版本的浏览器中，我们不能使用window.innerHeight来获取可视区域的高度。然而，我们可以使用document.documentElement.clientHeight、document.body.clientHeight或者jQuery的方法来获取可视区域高度。选择哪种方案取决于你的项目需求和个人喜好。

无论你选择哪种方案，请确保在所有浏览器中都进行测试，以确保它们都能正常工作。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/30994