<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高
分享到：
相关推荐
这些属性帮助开发者了解和控制网页在不同浏览器环境下的显示效果，尤其是在响应式设计和动态布局调整方面。下面将详细解析每个概念及其在四种主要浏览器——IE（Internet Explorer）、NS（Netscape）、Opera、FF...
了解不同浏览器对`clientHeight`, `offsetHeight`, `scrollHeight`, `clientWidth`, `offsetWidth`, `scrollWidth`的支持情况是非常重要的，尤其是在进行响应式设计或需要精确控制元素尺寸的时候。通过上述解释和...
本文将详细解析如何通过JavaScript来获取不同浏览器下的窗口尺寸，并探讨一些特殊情况下需要注意的问题。 #### 一、基本概念 在讨论具体的实现方法之前，我们先了解几个基本的概念： - **`document.body....
对于W3C的标准，`document.documentElement.clientWidth` 和 `document.documentElement.clientHeight` 应该返回浏览器窗口的可视区域大小，但不同浏览器的实现有所差异。在没有定义标准的情况下，IE返回0，而Fire...
这个函数会返回当前浏览器窗口的可视高度和宽度，即使在不同浏览器和标准模式下也能得到一致的结果。`window.innerHeight` 和 `window.innerWidth` 是针对现代浏览器的解决方案，当其他方法失效时，它们通常能提供...
3. **使用`document.documentElement`**：在大多数情况下，使用`document.documentElement`而不是`document.body`可以获得更准确的结果。 ### 总结 通过上述介绍，我们可以看到JavaScript提供了多种方式来获取...
在编写网页应用和进行前端开发时，获取浏览器窗口的相关尺寸信息是常见...通过这些属性和方法，可以针对不同浏览器提供一致的用户体验，并且能够精确地控制网页布局，确保网页在所有主流浏览器上都能正常显示和工作。
在浏览器中，window对象表示一个窗口，它包含了有关当前浏览器窗口的信息，同时也提供了很多方法和属性来与这个窗口进行交互。window对象在JavaScript编程中扮演着极其重要的角色，因为它允许开发者访问浏览器的一些...
### JS 获取浏览器窗口大小 ...在实际开发中，我们需要根据具体需求选择合适的方法来获取所需的数据，同时也要注意不同浏览器之间的兼容性问题。希望本文能够帮助开发者更好地理解和掌握这一重要的前端技术点。
以下将详细介绍如何通过JavaScript获取这些信息，并探讨不同浏览器间可能存在的差异。 首先，我们可以使用`window.innerWidth`和`window.innerHeight`来获取浏览器窗口的总宽度和高度，包括工具栏和其他用户界面...
这些技术允许开发者在不同浏览器上准确地获取控件的位置信息。控件位置信息的获取，主要依赖于offset系列属性，client系列属性，以及scroll系列属性。这些属性在不同浏览器中存在一些差异，尤其在旧版浏览器中可能...
不同浏览器对`clientWidth`、`clientHeight`等属性的支持有所不同： - **Internet Explorer**: - `document.body.clientWidth`和`document.body.clientHeight`分别表示`BODY`的宽度和高度。 - `document....
### doctype后如何获得body.clientHeight的方法 #### 一、引言 在Web开发过程中，确保网页能够在不同浏览器中正确显示是非常重要的。其中，`clientHeight` 是一个常用的属性，用于获取元素的高度（不包括边框、内...
在不同浏览器中，获取浏览器的高度和宽度值的方法可能不同。例如： * 在 IE 中，`document.body.clientHeight` 和 `document.body.clientWidth` 获取的是 BODY 对象的高度和宽度 * 在 FireFox 中，`document.body....
3. **窗体尺寸**：IE通过document.body.offsetWidth和offsetHeight获取尺寸，FF则使用window.innerWidth和innerHeight以及document.documentElement.clientWidth和clientHeight。推荐使用document.body.clientWidth...
本篇文章将详细介绍如何通过 JavaScript 获取不同浏览器中的高度和宽度。 #### 1. 获取 BODY 对象的宽度和高度 - **`document.body.clientWidth`**: 返回 BODY 元素的可见宽度（不包括滚动条和边框）。 - **`...
本文将详细解析如何通过JavaScript获取不同浏览器中的浏览器高度、宽度以及相关的一些其他尺寸信息。 1. **浏览器高度和宽度的获取** - `document.body.clientWidth` 和 `document.body.clientHeight`: 这两个...
在不同浏览器中的实现可能有所不同，因此在编写 JavaScript 代码时，需要注意浏览器的兼容性问题。 总结 以上是获取浏览器高度和宽度值、获取文本框的值的方法，通过了解这些方法，可以更好地编写 JavaScript 代码...
由于不同浏览器支持的API不同，上述代码中使用了多种方法来确保代码的兼容性。例如： - `window.innerHeight` 和 `window.innerWidth`：现代浏览器的标准方式。 - `document.documentElement.clientHeight` 和 `...