更新
我的原始答案写于2009年。尽管它仍然有效，但我想在2017年进行更新。浏览器的行为仍然有所不同。我相信jQuery团队在保持跨浏览器的一致性方面做得很好。但是，没有必要包括整个库。在jQuery源代码中，相关部分位于Dimensions.js的第37行。在这里，将其提取并修改为独立工作：
function getWidth() {
return Math.max(
document.body.scrollWidth,
document.documentElement.scrollWidth,
document.body.offsetWidth,
document.documentElement.offsetWidth,
document.documentElement.clientWidth
);
}
function getHeight() {
return Math.max(
document.body.scrollHeight,
document.documentElement.scrollHeight,
document.body.offsetHeight,
document.documentElement.offsetHeight,
document.documentElement.clientHeight
);
}
console.log('Width: ' + getWidth() );
console.log('Height: ' + getHeight() );
原始答案
由于所有浏览器的行为都不同，因此您需要先测试值，然后再使用正确的值。这是一个为您执行此操作的函数：
function getWidth() {
if (self.innerWidth) {
return self.innerWidth;
}
if (document.documentElement && document.documentElement.clientWidth) {
return document.documentElement.clientWidth;
}
if (document.body) {
return document.body.clientWidth;
}
}
以及类似的高度：
function getHeight() {
if (self.innerHeight) {
return self.innerHeight;
}
if (document.documentElement && document.documentElement.clientHeight) {
return document.documentElement.clientHeight;
}
if (document.body) {
return document.body.clientHeight;
}
}
使用getWidth()或在脚本中调用它们getHeight()。如果未定义浏览器的任何本机属性，它将返回undefined。
602392714
清零编程群