javascript获取网页宽高方法汇总
document.body.clientWidth - 网页可见区域宽
document.body.clientHeight - 网页可见区域高
document.body.offsetWidth - 网页可见区域宽，包括边线和滚动条的宽
document.body.offsetHeight - 网页可见区域高，包括边线和滚动条的高[FF,chrom下是整个页面高，IE opera 下正常]
document.body.scrollWidth - 网页总宽
document.body.scrollHeight - 网页总高
document.body.scrollTop - 有滚动条的时候，向下拖动滚动条，上方不显示的那部分高度
document.body.scrollLeft - 同上
window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
window.screenTop - 网页正文部分上[网页文档的最上方距离屏幕最上方的距离，但FF不支持，Chrom,IE,Opera表现都不同，慎用]
window.screenLeft - 网页正文部分左[网页文档的最左方距离屏幕最左方的距离，但FF不支持，Chrom,IE,Opera表现都不同，慎用]
window.screen.height - 屏幕分辨率的高度
window.screen.width - 屏幕分辨率的宽度
window.screen.availHeight - 可用工作区高度[整个屏幕但不包括下方任务栏]
window.screen.availWidth - 可用工作区宽度[整个屏幕的宽度]
window.screen.clorDepth - 屏幕色彩，常用的16,32位等
window.screen.deviceXDPI - 屏幕像素/英寸【IE支持，其它不支持】
JavaScript 获取页面宽高的方法
<script>
function getInfo()
{
var s = "";
s += " 网页可见区域宽："+ document.body.clientWidth;
s += " 网页可见区域高："+ document.body.clientHeight;
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();
</script>
在我本地测试当中：
在IE、FireFox、Opera下都可以使用
document.body.clientWidth document.body.clientHeight
即可获得，很简单，很方便。
而在公司项目当中：
Opera仍然使用
document.body.clientWidth document.body.clientHeight
可是IE和FireFox则使用
document.documentElement.clientWidth document.documentElement.clientHeight
原来是W3C的标准在作怪啊
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
如果在页面中添加这行标记的话
在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高）
而如果没有定义W3C的标准，则
IE为：
document.documentElement.clientWidth ==> 0 document.documentElement.clientHeight ==> 0
FireFox为：
document.documentElement.clientWidth ==> 页面对象宽度（即BODY对象宽度加上Margin宽） document.documentElement.clientHeight ==> 页面对象高度（即BODY对象高度加上Margin高）
Opera为：
document.documentElement.clientWidth ==> 页面对象宽度（即BODY对象宽度加上Margin宽） document.documentElement.clientHeight ==> 页面对象高度（即BODY对象高度加上Margin高）
以上所述就是本文的全部内容了，希望大家能够喜欢。
-
本文向大家介绍javascript获取网页各种高宽及位置的方法总结，包括了javascript获取网页各种高宽及位置的方法总结的使用技巧和注意事项，需要的朋友参考一下 screen对象 获取屏幕的高宽（分辨率） window对象 获得窗口位置及大小 element对象 在介绍element对象各种高宽之前有必要解释一下盒模型 默认盒模型 box-sizing:content-box; 当不出现滚动
-
本文向大家介绍js获取图片宽高的方法，包括了js获取图片宽高的方法的使用技巧和注意事项，需要的朋友参考一下 本文分享多种js获取图片宽高的方法，并且通过实例进行分析，希望大家从中有所收获。 一、简陋的获取图片方式 结果如下： 宽高都是0的这个结果很正常，因为图片的相关数据都没有被加载前它的宽高默认就是0 于是可以这么优化！ 二、onload后在打印 结果如下 通过onload就能获取到图片的宽
-
本文向大家介绍写一个方法获取div的宽高相关面试题，主要包含被问及写一个方法获取div的宽高时的应答技巧和注意事项，需要的朋友参考一下
-
本文向大家介绍JavaScript获取网页表单提交方式的方法，包括了JavaScript获取网页表单提交方式的方法的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了JavaScript获取网页表单提交方式的方法。分享给大家供大家参考。具体如下： JavaScript获取网页表单的提交方式是get还是post，获取提交方式可以通过表单的method属性获得 运行结果如下： 希望本文所述对大家的
-
本文向大家介绍JavaScript获取网页表单action属性的方法，包括了JavaScript获取网页表单action属性的方法的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了JavaScript获取网页表单action属性的方法。分享给大家供大家参考。具体如下： JavaScript获取网页表单的action属性，即要提交到的url地址，有时候需要提交到当前页面，则可能会设置actio
-
本文向大家介绍Javascript获取图片原始宽度和高度的方法详解，包括了Javascript获取图片原始宽度和高度的方法详解的使用技巧和注意事项，需要的朋友参考一下 前言 网上关于利用Javascript获取图片原始宽度和高度的方法有很多，本文将再次给大家谈谈这个问题，或许会对一些人能有所帮助。 方法详解 页面中的img元素，想要获取它的原始尺寸，以宽度为例，可能首先想到的是元素的innerWi