今天在调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. Zuul整合Swagger,使用ZuulFilter解决下游服务context-path

    问题起因:使用Zuul网关服务,需要整合下游系统的swagger,但是下游服务存在context-path配置,无法正确跳转,最后使用ZuulFilter解决. 1.Zuul整合下游swagger 首 ...

  2. oracle--CRS-0215 : Could not start resource 'ora.node2.ons'.

    01,问题描述 安装10G+RAC集群,在node2进行vipca操作的时候发现这个问题 02,问题解决 原因是少了host的回环地址,当时删除错了 添加进去即可 127.0.0.1 localhos ...

  3. .NET Core创建Worker Services

    .NET CORE 3.0新增了Worker Services的新项目模板,可以编写长时间运行的后台服务,并且能轻松的部署成windows服务或linux守护程序.如果安装的vs2019是中文版本,W ...

  4. 使用windows 上的远程连接来远程Linux Ubuntu系统的设置

    实验环境: Windows 10 , VMware Workstation ,Ubuntu16.04 1.root登录ubuntu,然后执行下面的命令 # root账户登录ubuntu ,执行下面的命 ...

  5. jsp之el表达式jstl标签

    不管是el表达式还是jstl标签最终的目的都是要消除jsp中的java代码,当然是消除显式的java代码 el表达式的出现是为了简化jsp中读取数据并写入页面的操作. el表达式的功能不多,也很好记 ...

  6. Java8 新特性 Stream 非短路终端操作

    非短路终端操作 Java8 新特性 Stream 练习实例 非短路终端操作,就是所有的元素都遍厉完,直到最后才结束.用来收集成自己想要的数据. 方法有: 遍厉 forEach 归约 reduce 最大 ...

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

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

  8. dns攻击包代码实现

    博客地址:http://home.cnblogs.com/u/zengjianrong/ 代码没有做好精简,有些多余的没有删去,因为博主太懒了哈哈 #include <stdio.h> # ...

  9. Docker 快速安装&搭建 Mysql 环境

    欢迎关注个人微信公众号: 小哈学Java, 文末分享阿里 P8 高级架构师吐血总结的 <Java 核心知识整理&面试.pdf>资源链接!! 个人网站: https://www.ex ...

  10. Ubuntu Nginx https 配置

    #配置http跳转到https 80跳转443server { listen ; server_name www.***.com www.***.cn; https://$server_name$re ...