js原生获取html的高度,如何获取HTML的高度?
我把结论写上面
总的来说 设置了
*{
margin:0;
padding:0;
}
后就可以用clientHeight、offsetHeight来获取html了
没有设置的时候:
设置后的body跟html一样height
function getInfo()
{
var s = "";
s += " 网页可见区域宽:"+ document.body.clientWidth;
s += " 网页可见区域高:"+ document.body.clientHeight; //body
s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)";
s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)";
s += " 网页正文全文宽:"+ document.body.scrollWidth;
s += " 网页正文全文高:"+ document.body.scrollHeight; //窗口
s += " 网页被卷去的高(ff):"+ document.body.scrollTop;
s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop;
s += " 网页被卷去的左:"+ document.body.scrollLeft;
s += " 网页正文部分上:"+ window.screenTop;
s += " 网页正文部分左:"+ window.screenLeft;
s += " 屏幕分辨率的高:"+ window.screen.height;
s += " 屏幕分辨率的宽:"+ window.screen.width;
s += " 屏幕可用工作区高度:"+ window.screen.availHeight;
s += " 屏幕可用工作区宽度:"+ window.screen.availWidth;
s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色";
s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸";
//alert (s);
}
getInfo();
var a=0;
setInterval(function(){
a= document.body.scrollHeight
console.log(a);
},400)
我是写了一个定时器 每400毫秒查一下数据 发现这里获取到的是窗口大小
var a=0;
setInterval(function(){
a= document.body.offsetHeight //也可以是clientHeight
console.log(a);
},400)
你可以看到我的html文档中只有一个div高度为21
但是 我发现 上面的offsetHeight //也可以是clientHeigh获取的都是body大小 当你在没有设置
*{
margin:0;
padding:0;
}
设置后 html就跟body等高 用上面方法就可以
我把结论写上面 总的来说 设置了 *{ margin:0; padding:0; } 后就可以用clientHeight、offsetHeight来获取html了 没有设置的时候: 设置后的body跟html一样height function getInfo() { var s = ""; s += " 网页可见区域宽:"+ document.body.clientWidth; s += " 网页可见区域高:"+ document.body.clientHeight; //body s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)"; s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)"; s += " 网页正文全文宽:"+ document.body.scrollWidth; s += " 网页正文全文高:"+ document.body.scrollHeight; //窗口 s += " 网页被卷去的高(ff):"+ document.body.scrollTop; s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop; s += " 网页被卷去的左:"+ document.body.scrollLeft; s += " 网页正文部分上:"+ window.screenTop; s += " 网页正文部分左:"+ window.screenLeft; s += " 屏幕分辨率的高:"+ window.screen.height; s += " 屏幕分辨率的宽:"+ window.screen.width; s += " 屏幕可用工作区高度:"+ window.screen.availHeight; s += " 屏幕可用工作区宽度:"+ window.screen.availWidth; s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"; s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"; //alert (s); } getInfo(); var a=0; setInterval(function(){ a= document.body.scrollHeight console.log(a); },400) 我是写了一个定时器 每400毫秒查一下数据 发现这里获取到的是窗口大小 var a=0; setInterval(function(){ a= document.body.offsetHeight //也可以是clientHeight console.log(a); },400) 你可以看到我的html文档中只有一个div高度为21 但是 我发现 上面的offsetHeight //也可以是clientHeigh获取的都是body大小 当你在没有设置 *{ margin:0; padding:0; } 设置后 html就跟body等高 用上面方法就可以