今天在调js的时候,发现firefox和IE在取document.body.offsetHeight的值的时候结果不一样。上网查了一下,发现如下结果:
 

这四种浏览器分别为IE(Internet Explorer)、NS(Netscape)、Opera、FF(FireFox)。

clientHeight
大家对 clientHeight
都没有什么异议,都认为是内容可视区域的高度,也就是说页面浏览器中可以看到内容的这个区域的高度,一般是最后一个工具条以下到状态栏以上的这个区域,与页面内容无关。

offsetHeight
IE、Opera 认为 offsetHeight =
clientHeight + 滚动条 + 边框。
NS、FF 认为 offsetHeight 是网页内容实际高度,可以小于
clientHeight。

scrollHeight
IE、Opera 认为 scrollHeight 是网页内容实际高度,可以小于
clientHeight。
NS、FF 认为 scrollHeight 是网页内容高度,不过最小值是
clientHeight。

简单地说
clientHeight 就是透过浏览器看内容的这个区域高度。
NS、FF 认为 offsetHeight 和 scrollHeight
都是网页内容高度,只不过当网页内容高度小于等于 clientHeight
时,scrollHeight 的值是 clientHeight,而 offsetHeight 可以小于
clientHeight。
IE、Opera 认为 offsetHeight
是可视区域 clientHeight 滚动条加边框。scrollHeight
则是网页内容实际高度。

同理
clientWidth、offsetWidth 和 scrollWidth
的解释与上面相同,只是把高度换成宽度即可。

但是
FF 在不同的 DOCTYPE 中对 clientHeight
的解释不同, xhtml 1 trasitional
中则不是如上解释的。其它浏览器则不存在此问题。

offsetHeight在不同的浏览器下取值不同的更多相关文章

  1. asp.net C# int 类型在32/64位环境下取值范围无变化

    最近在学习中突然想到,我在64位环境下,int取值范围是否有变化?为了检测这个结果,我做了以下这个测试:1.环境:win7旗舰版64位+vs2010 sp1(版本号:10.0.40219.1SP1Re ...

  2. EASYUI combobox firefox 下取值为空的问题或不支持中文检索的问题

    输入中文包含数字 或者全部非中文是没问题的,这个是因为火狐浏览器输入中文输入法的时候 只能触发onkeyup而不能触发onkeydown的问题.而easyui渲染后赋值给隐藏input的过程需要 依赖 ...

  3. 学习笔记 - 深究Bitmap压缩避免OOM的核心inSampleSize的最佳取值

    /** * 测试代码,通过在SDCard根目录放置几种不同大小的图片, 来自动测试压缩方式是否有效同时看是否会内存不够. * * @since * By:AsionTang * At:2014年3月2 ...

  4. loadrunner 脚本优化-参数化之Parameter List参数取值

    脚本优化-参数化之Parameter List参数取值 by:授客 QQ:1033553122 参数取值选项 Select next row Update value on 以上两个选项是改变参数化取 ...

  5. LoadRunner进行参数化的九种方式取值和连接数据库取值

    一.连接mysql数据库取值 1.首先安装odbc驱动 链接: https://pan.baidu.com/s/1WAYd4ygQqIrbB08S01hSkg 提取码: gdfs 2.操作步骤如下图: ...

  6. Loadrunder之脚本篇——参数化取值策略

    参数取值选项 Select next row Update value on 以上两个选项是改变参数化取值的关键选项. Select next row包含如下选项: Sequential:顺序选择 R ...

  7. Jquery操作下拉框(DropDownList)实现取值赋值

    Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...

  8. Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢)

    Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢) 1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val() ...

  9. 保留键的情况下取字典中最大的值(max\zip函数的联合使用)

    在我们平常想要获取字典中value最大或者最小的值的时候,常常使用如下函数: testDict = {"age1":18,"age2":20,"age ...

随机推荐

  1. 简单模仿QQ聊天界面

    首先看一下最终的效果,显示了消息时间,用户昵称,用户头像. 大致实现方法: 用最简单的ListView显示消息内容. 不同的用户使用不同的消息布局文件,从而达到头像左右显示的效果,如上图有2个用户&q ...

  2. wpf “{DependencyProperty.UnsetValue}”不是属性“Background”的有效值。异常

    , 在wpf模板中, 有一个Background绑定的值不存在导致的异常, 我的是有这个没有导致的错误,  自己添加之后就没有了

  3. oracle--表空间基本操作

    --查表空间使用率情况(含临时表空间) SELECT d.tablespace_name "Name", d.status "Status", TO_CHAR ...

  4. java-int数据的溢出

    数据的溢出: 当整数的数据大小超出了可以表示的范围,而程序中又没有做数值范围的检查时, 这个整型变量所输出的值将发生紊乱,且不是预期的运行结果. 01 //  整数值如果超出了自己所可以表示范围的最大 ...

  5. Android保存的文件显示到文件管理的最近文件和下载列表中

    发现Android开发每搞一个和系统扯上关系的功能都要磨死人,对新手真不友好.运气不好难以快速精准的找到有效的资料

  6. 第三次实验报告:使用Packet Tracer分析TCP连接建立过程

    目录 1 实验目的 2 实验内容 3. 实验报告 3.1 建立网络拓扑结构 3.2 配置参数 3.3 抓包,分析TCP连接建立过程 4. 拓展 (不作要求,但属于加分项) 1 实验目的 使用路由器连接 ...

  7. 初识Go语言--(2)Hello World

    新建hello.go文件,内容如下 package main import "fmt" func main() { //输出Hello World fmt.Println(&quo ...

  8. GitHub的高级搜索功能

    1. 首先,提供Github高级搜索帮助页面https://help.github.com/categories/search/     2. 搜索语法https://help.github.com/ ...

  9. C# 分解文件路径目录

    利用正则表达式分解文件目录 [^\\].*?[\\$]|[^\\].*?\.\w+|\w+ 测试字符串:C:\Users\wppcn\Desktop\中文长字符第一次测试\新建文件夹1\新建文件夹2\ ...

  10. Knative 基本功能深入剖析:Knative Eventing 之 Sequence 介绍

    作者 | 元毅,阿里云容器平台高级开发工程师,负责阿里云容器平台 Knative 相关工作. 导读:在实际的开发中我们经常会遇到将一条数据需要经过多次处理的场景,称为 Pipeline.那么在 Kna ...