js如何根据不同屏幕的大小，获得页面高度，自动调整列表高度

var win_w = $(window)width();//获取宽度

var win_h = $(window)height();//获取高度

如果你想要匹配高度，那么，就是页面刚刚打开其实没有数据，是等页面打开，计算了屏幕高度之后，再根据每条数据的高度计算出条数，再利用ajax的异步传输去读取列表，然后用JS呈现在手机网页中的。

11 获取屏幕绝对高度： RealHeight

12 获取屏幕高度： Height

13 获取状态栏高度： StatusBarHeight

14 获取导航栏高度： NavigationbarHeight

假设出现窗口没准确出现在锚点下方，或者半透明背景没占满余下屏幕的情况，看看高度取值是否准确。

经常发现在写JavaScript的时候，都需要用到网页、浏览器或屏幕的高度和宽度来解决布局定位的问题，时常前用后忘，要不就是在网上search，干脆自己总结一下，这样也方便再次使用，省时省力。

网页可见区域宽：documentbodyclientWidth

网页可见区域高：documentbodyclientHeight

网页可见区域宽：documentbodyoffsetWidth

(包括边线的宽)

网页可见区域高：documentbodyoffsetHeight

(包括边线的宽)

网页正文全文宽：documentbodyscrollWidth

（带滚动条宽）

网页正文全文高：documentbodyscrollHeight

（带滚动条高）

网页被卷去的高：documentbodyscrollTop

网页被卷去的左：documentbodyscrollLeft

网页正文部分上：windowscreenTop

网页正文部分左：windowscreenLeft

屏幕分辨率的高：windowscreenheight

屏幕分辨率的宽：windowscreenwidth

屏幕可用工作区高度：windowscreenavailHeight

屏幕可用工作区宽度：windowscreenavailWidth

HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth

scrollHeight:

获取对象的滚动高度。

scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离

scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离

scrollWidth:获取对象的滚动宽度

offsetHeight:获取对象相对于版面或由父坐标

offsetParent

属性指定的父坐标的高度

offsetLeft:获取对象相对于版面或由

offsetParent

属性指定的父坐标的计算左侧位置

offsetTop:获取对象相对于版面或由

offsetTop

属性指定的父坐标的计算顶端位置

eventclientX

相对文档的水平座标

eventclientY

相对文档的垂直座标

eventoffsetX

相对容器的水平坐标

eventoffsetY

相对容器的垂直坐标

documentdocumentElementscrollTop

垂直方向滚动的值

eventclientX+documentdocumentElementscrollTop

相对文档的水平座标+垂直方向滚动的量

IE，FireFox

差异如下：

IE60、FF106+：

复制代码

代码如下:

clientWidth

=

width

+

padding

clientHeight

=

height

+

padding

offsetWidth

=

width

+

padding

+

border

offsetHeight

=

height

+

padding

+

border

IE50/55：

复制代码

代码如下:

clientWidth

=

width

-

border

clientHeight

=

height

-

border

offsetWidth

=

width

offsetHeight

=

height

总结：关于高度和宽度的东西到是挺多的，具体的有些自己也没有弄懂，通过自己试验了一下，有些得出的值是一样，所以很让人迷惑，只能视情况而定了。

以上就是关于js如何根据不同屏幕的大小，获得页面高度，自动调整列表高度全部的内容，包括:js如何根据不同屏幕的大小，获得页面高度，自动调整列表高度、状态栏、导航栏、PopupWindow的使用、JavaScript获取网页、浏览器、屏幕高度和宽度汇总等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！