Javascript:

IE中：
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度
FireFox中：
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度
Opera中：
document.body.clientWidth ==> 可见区域宽度
document.body.clientHeight ==> 可见区域高度
document.documentElement.clientWidth ==> 页面对象宽度（即BODY对象宽度加上Margin宽）
document.documentElement.clientHeight ==> 页面对象高度（即BODY对象高度加上Margin高）

alert(document.body.clientWidth);        //网页可见区域宽(body)

alert(document.body.clientHeight);       //网页可见区域高(body)

alert(document.body.offsetWidth);       //网页可见区域宽(body)，包括border、margin等

alert(document.body.offsetHeight);      //网页可见区域宽(body)，包括border、margin等

alert(document.body.scrollWidth);        //网页正文全文宽，包括有滚动条时的未见区域

alert(document.body.scrollHeight);       //网页正文全文高，包括有滚动条时的未见区域

alert(document.body.scrollTop);           //网页被卷去的Top(滚动条)

alert(document.body.scrollLeft);           //网页被卷去的Left(滚动条)

alert(window.screenTop);                     //浏览器距离Top

alert(window.screenLeft);                     //浏览器距离Left

alert(window.screen.height);                //屏幕分辨率的高

alert(window.screen.width);                 //屏幕分辨率的宽

alert(window.screen.availHeight);          //屏幕可用工作区的高

alert(window.screen.availWidth);           //屏幕可用工作区的宽

Jquery

alert($(window).height());                           //浏览器当前窗口可视区域高度

alert($(document).height());                        //浏览器当前窗口文档的高度

alert($(document.body).height());                //浏览器当前窗口文档body的高度

alert($(document.body).outerHeight(true));  //浏览器当前窗口文档body的总高度 包括border padding margin

alert($(window).width());                            //浏览器当前窗口可视区域宽度

alert($(document).width());                        //浏览器当前窗口文档对象宽度

alert($(document.body).width());                //浏览器当前窗口文档body的宽度

alert($(document.body).outerWidth(true));  //浏览器当前窗口文档body的总宽度 包括border padding margin

<!DOCTYPE html>

<script src="jquery-1.5.1.min.js" type="text/javascript"></script>

<html>

  <head>

    <title>aaa</title>

  </head>

  <body>

<h1>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

aaaaaaaaaaaaaaaaaa</h1>

    <p>Welcome to aaa</p>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

<h1>aaa</h1>

  </body>

</html>

<script type="text/javascript">

alert(document.body.clientWidth);

alert(document.body.clientHeight);

alert(document.body.offsetWidth);

alert(document.body.offsetHeight);

alert(document.body.scrollWidth);

alert(document.body.scrollHeight);

alert(document.body.scrollTop);

alert(document.body.scrollLeft);

alert(window.screenTop);

alert(window.screenLeft);

alert(window.screen.height);

alert(window.screen.width);

alert(window.screen.availHeight);

alert(window.screen.availWidth);

//alert($(document).height());

//alert($(document).width());

</script>

Javascript、Jquery获取浏览器和屏幕各种高度宽度的更多相关文章

  1. Javascript&Jquery获取浏览器和屏幕各种高度宽度方法总结及运用

    <js篇> Javascript获取浏览器和屏幕各种高度宽度方法总结 document.body.clientWidth       //网页可见区域宽(body) document.bo ...

  2. Javascript、Jquery获取浏览器和屏幕各种高度宽度（单位都为px）

    Javascript.Jquery获取浏览器和屏幕各种高度宽度 另外参见    http://www.cnblogs.com/top5/archive/2009/05/07/1452135.html ...

  3. Javascript、Jquery获取浏览器和屏幕各种高度宽度[mark]

    Javascript: IE中:document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度d ...

  4. JS、Jquery获取浏览器和屏幕各种高度宽度

    网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth ...

  5. JS、JQUERY 获取浏览器和屏幕各种高度宽度

    好长时间没有更新博客了... 把我最近积累的一点知识点放上博客,以后以备不需之要,也给大家整理一下.. Javascript: IE中:document.body.clientWidth ==> ...

  6. C#-WebForm-Javascript、Jquery获取浏览器和屏幕各种高度宽度

    Javascript: IE中:document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度d ...

  7. Jq_Js_Js、Jq获取浏览器和屏幕各种高度宽度

    $(document).ready(function()         {alert($(window).height()); //浏览器当前窗口可视区域高度alert($(document).he ...

  8. js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码

    获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下.IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 代码如下: document.body.offsetWidth doc ...

  9. js 和 jquery 获取页面和滚动条的高度 视口高度文档高度

    js 和 jquery 获取页面和滚动条的高度 //页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight & ...

随机推荐

  1. zabbix安装

    在服务器10.128.17.136上安装 1.安装mysql \# yum -y install mysql mysql-server mysql-devel MySQL 配置文件/etc/my.cn ...

  2. 移动端Web开发调试之Chrome远程调试(Remote Debugging)

    比如手机钉钉调试页面,下面是一位同学整理的链接: http://blog.csdn.net/freshlover/article/details/42528643/ 如果inspect 后,一直空白, ...

  3. Python *与** 参数问题

    问题:     Python的函数定义中有两种特殊的情况,即出现*,**的形式.     如:def myfun1(username, *keys)或def myfun2(username, **ke ...

  4. 关于JSP中<body onload="fun()">body标签中onload中函数不执行问题

    问题描述: 在一个页面中,我们经常会初始化一下数据,而且会在指定的DOM元素初始化数据,这时候我们就会使用<body onload="fun()">来加载我们的数据.o ...

  5. Linux 下 查看以及修改文件权限

    查看权限 在终端输入: ls -l xxx.xxx (xxx.xxx是文件名) 那么就会出现相类似的信息,主要都是这些: -rw-rw-r-- 其中: 最前面那个 - 代表的是类型 中间那三个 rw- ...

  6. IO例子

    1.用字节读取一个文件,替换换行符,并打印 String fileName = "src/learnIO/Stream.java"; FileInputStream in = ne ...

  7. 一个简单实用的css loading图标

    摘要 在web开发中,为了提高用户体验,在加载数据的时候都会给一个loading的提示. Html <!DOCTYPE html> <html xmlns="http:// ...

  8. [转]socket 通俗解释

    socket是网络编程的基础,本文用打电话来类比socket通信中建立TCP连接的过程.    socket函数,表示你买了或者借了一部手机.    bind函数,告诉别人你的手机号码,让他们给你打电 ...

  9. 一个java源文件中为什么只能有一个public类。

    我们都遇到过一个源文件中有多个java类,但当第一个类使用public修饰时,如果下面还有类使用public修饰,会报错.也就是是说一个java源文件最多只能有一个public类. 当有一个publi ...

  10. VB操作EXCEL文件

    用VB操作Excel(VB6.0)(整理) 首先创建Excel对象,使用ComObj:Dim ExcelID as Excel.ApplicationSet ExcelID as new Excel. ...