努力思考 + 实践, 眼高手低是不行的. 注册 | 登陆

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高)

未定义标准
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高)

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

Tags: javascript, 标准

« 上一篇 | 下一篇 »

只显示5条记录相关文章

顽皮的闭包 (浏览: 2935, 评论: 0)
IE与FF下对节点操作的问题若干 (浏览: 4833, 评论: 2)
input高级限制级用法 (浏览: 4930, 评论: 2)
[转] 不可多得的Javascript(AJAX)开发工具 - Aptana (浏览: 7075, 评论: 8)
[PEA福州] Zifa FormValid 0.5 更新[无js实现表单验证] (浏览: 5887, 评论: 2)

Trackbacks

点击获得Trackback地址,Encode: UTF-8

本文因为某种原因此时不允许访客进行评论