当你的网页有：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

的时候，document.body.clientHeight就用不了，页面无限拉长。 这个时候可以用document.documentElement.clientHeight来替代。 对于width同理。

<!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高）

document.body.clientHeight与document.documentElement.clientHeight的更多相关文章

  1. document.documentElement.clientHeight 与 document.body.clientHeight(杜绝千篇一律的抄袭!!)

    document.documentElement.clientHeight 与 document.body.clientHeight用来获取页面可视高度我觉得有点问题.这两个应该不是一个东西. 页面中 ...

  2. document.documentElement.clientHeight 和 $(window).height() 无法正确获取页面可视区高度

    背景: 弹出层插件(自适应) 实现过程中突然发现在获取可视区高度时,无论document.documentElement.clientHeight 还是 $(window).height()都无法正确 ...

  3. [No000068]document.body.clientHeight 和 document.documentElement.clientHeight 的区别

    document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...

  4. document.body.clientHeight 和 document.documentElement.clientHeight的区别

    document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.document ...

  5. document.body.clientHeight和 document.documentElement.clientHeight 的区别

    1.javascript中的 document.body.clientHeight 和 document.documentElement.clientHeight 的区别 在往同事负责的页面添加我的功 ...

  6. document.documentElement.clientHeight||document.documentElement.scrollHeight

    在我看<JavaScript高级程序设计>(第三版)的时候,在clientHeight和scrollHeight那部分把我弄糊涂了. 原书是这样写的:( //宽度同理,就不仔细描述了.) ...

  7. document.documentElement.clientHeight和document.body.clientHeight区别

    首先了解下document HTML DOM 节点 在 HTML DOM (Document Object Model) 中 , 每一个元素都是 节点: 文档是一个文档节点. 所有的HTML元素都是元 ...

  8. window.screen.height和window.screen.availHeight和document.body.clientHeight和document.documentElement.clientHeight

    说这几个属性前 我说一下我的设备 我的设备有两个,一个高度为1080的显示器,一个高度为800的电脑 第一种:window.screen.height 这个方法是获取用户电脑屏幕的高度,是不关浏览器或 ...

  9. window.innerHeight和document.documentElement.clientHeight区别

    今天有人问我这个问题,做了个小例子来记录一下子. 首先这两个都是获取可视区域的高度,那他们有什么区别呢 1.window.innerHeight属于BOM(浏览器对象模型),而document.doc ...

随机推荐

  1. ASP.NET将word文档转换成pdf的代码

    一.添加引用 using Microsoft.Office.Interop.Word; 二.转换方法 1.方法 C# 代码 /// <summary> /// 把Word文件转换成pdf文 ...

  2. 1.1……什么是3G

    移动通信技术的发展 第一代移动通信技术(1st - Generation),只能进行语音通话. 第二代移动通信技术(2nd - Generation),可以收发短信.可以上网,但速度只有几十Kbps, ...

  3. BootStrap入门教程 (二) ：BASE CSS（排版(Typography),表格(Table),表单(Forms),按钮(Buttons)）

    上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...

  4. java 复习003

    今天主要复习下数据结构的东西 树 自平衡二叉查找树 AVL树(高平衡树)(wiki) 特性:任何节点的两个子树的高度最大差别为一 时间复杂度:查找.插入和删除在平均和最坏情况下都是O(log n) 红 ...

  5. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇01：播放序列动画》

    1.播放序列动画 系列动画播放概述 2D游戏中的动画系统,不同于3D游戏.3D游戏中,角色美术资源不仅包含角色模型的,还包括角色的贴图和动作等,模型本身自带角色的动作动画效果.2D游戏中,角色美术资源 ...

  6. 虚拟化技术对比：Xen vs KVM

    恒天云:http://www.hengtianyun.com/download-show-id-68.html 一.说明 本文主要从功能方面和性能方面对Xen和KVM对比分析,分析出其优缺点指导我们恒 ...

  7. MES生产日报存储过程

    USE [ScreenMonitor]GO/****** Object: StoredProcedure [dbo].[ImportProductForDay] Script Date: 04/11/ ...

  8. mysql与java数据类型对照

    类型名称 显示长度 数据库类型 JAVA类型 JDBC类型索引(int) 描述 VARCHAR L+N VARCHAR java.lang.String 12 CHAR N CHAR java.lan ...

  9. eclipse 插件

    eclipse 插件 pdt(http://projects.eclipse.org/projects/tools.pdt/downloads) PHP Development Tools 3.2 R ...

  10. 让EditText不能自动获取焦点

    在activity中放置了1个或1个以上的EditText,进入该activity的时候第一个EditText会接收焦点,我希望里面所有的EditText默认是不接收焦点的,该怎么做呢? 方法: 在第 ...