Javascript 获取页面高度（多种浏览器）【转】

关于获取各种浏览器可见窗口大小的一点点研究。

在我本地测试当中：

在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的标准在作怪啊 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高）

真是一件麻烦事情，其实就开发来看，宁可少一些对象和方法，不使用最新的标准要方便许多啊。

转载于:https://www.cnblogs.com/yezhenhan/archive/2011/06/17/2083562.html

Javascript 获取页面高度（多种浏览器）【转】相关推荐

Javascript 获取页面高度（多种浏览器）
关于获取各种浏览器可见窗口大小的一点点研究. 在我本地测试当中: 在IE.FireFox.Opera下都可以使用 document.body.clientWidth document.body.cli ...
JavaScript获取页面高度
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
javascript 获取滚动条高度+常用js页面宽度与高度
javascript 获取滚动条高度+常用js页面宽度与高度/ ********************* 取窗口滚动条高度****************** / function getScrol ...
js，jquery获取页面元素距离浏览器工作区顶端的距离
先介绍几个属性:(暂时只测了IE和firefox,实际上我工作中用到的最多的是chrome) 网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度) (javascript) ...
jq获取页面高度_jquery获取文档高度和窗口高度汇总
jquery获取窗口高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...
html页面高度不同浏览器兼容性设置
页面需要嵌套在跨域的iframe中,而页面高度不固定,需要每个页面把自己的高度获得后,通过js通知iframe调整显示. 而页面在获得自己的高度时,发现总是比预想的大.经过参考别人的博客,发现原来是w ...
jq获取页面高度_jquery常见获取高度
jquery获取文档高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...
用JavaScript获取页面上被选中的文字的技巧
这里介绍的一个小技巧是如何用JavaScript获取页面上被选中的文字的方法.最关键的JavaScript API是: event.selection = window.getSelection(); ...
小程序:获取页面高度问题
背景最近在和同伴一起做小程序,发现用swiper实现滑动栏会出现中间无内容却能滑动现象,用scroll-view需要获取高度才能适用如果对小程序滑动块不了解的,可以到微信小程序组件-试图容器了解 ...

Javascript 获取页面高度（多种浏览器）【转】

Javascript 获取页面高度（多种浏览器）【转】相关推荐

最新文章

热门文章