Javascript:
网页可见区域宽：
documentbodyclientWidth
网页可见区域高：
documentbodyclientHeight
网页可见区域宽：
documentbodyoffsetWidth
(包括边线的宽)
网页可见区域高：
documentbodyoffsetHeight
(包括边线的高)
网页正文全文宽：
documentbodyscrollWidth
网页正文全文高：
documentbodyscrollHeight
网页被卷去的高：
documentbodyscrollTop
网页被卷去的左：
documentbodyscrollLeft
网页正文部分上：
windowscreenTop
网页正文部分左：
windowscreenLeft
屏幕分辨率的高：
windowscreenheight
屏幕分辨率的宽：
windowscreenwidth
屏幕可用工作区高度：
windowscreenavailHeight
屏幕可用工作区宽度：
windowscreenavailWidth
JQuery:
$(document)ready(function(){
alert($(window)height());
alert($(document)height());
//浏览器当前窗口文档的高度
alert($(documentbody)height());//浏览器当前窗口文档body的高度
alert($(documentbody)outerHeight(true));//浏览器当前窗口文档body的总高度
包括border
padding
margin
alert($(window)width());
//浏览器当前窗口可视区域宽度
alert($(document)width());//浏览器当前窗口文档对象宽度
alert($(documentbody)width());//浏览器当前窗口文档body的宽度
alert($(documentbody)outerWidth(true));//浏览器当前窗口文档body的总宽度
包括border
padding
margin
})
因为微信页面启动后会显示工具栏。占用部分高度。
$(document)on('WeixinJSBridgeReady', function () {
windowWeixinJSBridgecall('hideToolbar');//调用这句会隐藏工具栏。但是这个方法也需要时间。因此你最好延迟几十毫秒，再去获取以下高度。这时候应该才是最终的。
});
要在js中获得浏览器的高度可以参考以下步骤(具体代码见最后）：
1、outerHeight属性设置或返回一个窗口的外部高度，包括所有界面元素（如工具栏/滚动条）。
2、outerWidth属性设置或返回窗口的外部宽度，包括所有的界面元素（如工具栏/滚动）。
3、innerheight 返回窗口的文档显示区的高度。
4、innerwidth 返回窗口的文档显示区的宽度。
补充：
在浏览器兼容方面：
1、所有主流浏览器都支持 outerWidth 和 outerHeight 属性。
注意：IE 8 及更早 IE 版本不支持该属性。
2、所有主流浏览器都支持 innerWidth 和 innerHeight 属性。
注意：IE 8 及更早 IE版本不支持这两个属性。
获取代码：
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 10 Transitional//EN"
<head>
<title>请调整浏览器窗口</title> <meta >
windowaddEventListener("orientationchange", function(){
alert('得到的是旋转之前DIV的高和宽')
setTimeout(function () { alert('延时一秒后得到的是旋转之后DIV的高和宽') }, 1000);
})
我是这样解决的，延时一秒后可以得到旋转之后的高和宽，但我总感觉这方法不太好 万一是性能不好的设备 一秒过后还没完成相应的设置 此方法就无效了，题主你是用什么方法解决的？
以上就是关于JS和jquery获取各种屏幕的宽度和高度全部的内容，包括:JS和jquery获取各种屏幕的宽度和高度、在iPhone微信网页用JS第一次获取高度是960刷新之后是823、js 如何获得浏览器的高度等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）