今天在调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. intellij idea安装教程

    1. 双击ideaIU-12.1.1.exe,点击下一步,安装目录改为d:\Program Files\JetBrains\IntelliJ IDEA,其他项都默认即可(此处更改目录方便重做系统,不用 ...

  2. Java 中 override 和 overload 区别

    问题出现: 即使对于一个经验丰富的开发人员来说,方法重载和方法覆盖的区别都能让他犹豫一下, 对于新手来说,经常容易弄混淆. 有没有比较深入浅出的理解方式,能让人过目不忘,用起来还能有条件反射般的速度呢 ...

  3. HTML+css基础 表格标签table Table标签属性 td标签属性

    表格标签table:   他是由行与列构成,最小单位是单元格. 行标签  <tr></tr> 单元格标签<td></td> Table标签属性: Bor ...

  4. Java 微信支付分对接记录 (先享后付)

    微信支付分(先享后付)对接记录: 微信支付分对接步骤 填写开通支付分的申请表格 此步骤大概需要审核 1-3 个工作日; (模板-服务信息配置表-[先享后付免确认]-[商户名].xls) 填写商户信息 ...

  5. Canon MF113W激光打印机双面打印方法

    系统:macOS 10.14.3 打印机:Canon MF113W 黑白激光打印机(不支持自动双面打印) 方法: 1)文件->打印->纸张处理->仅奇数页->倒序->打印 ...

  6. SpringBoot 打包成war

    1.修改pom.xml文件 <packaging>war</packaging> <properties> <project.build.sourceEnco ...

  7. asp.net web 项目 针对aspx和ashx的 IHttpHandlerFactory 开发

    ASP.NET Framework处理一个Http Request的流程: HttpRequest-->inetinfo.exe-->ASPNET_ISAPI.dll-->ASPNE ...

  8. chrome(谷歌)浏览器字体发虚解决办法

    chrome(谷歌浏览器)浏览网页时,字体发虚的解决办法: 1.点击chrome里的 “设置” - 外观 - 字体,改为 微软雅黑,该方法测试无效. 2.将系统字体的pingfang字体卸载,完美解决 ...

  9. Loadrunner 11.00 初始化失败; 通信错误。 Error (-81024): LR_VUG: The 'WS_SOAP' type is not supported on 'WIN32' platforms .

    搜索LR安装目录bin文件夹下有个“wlrun.exe”的文件,邮件点击“属性”->"兼容性"->兼容模式中选择“windows 7”,确认后重新打开即可,win10下 ...

  10. WPF布局介绍(1)

    开局一张图,内容全靠...,本系列的文章, 主要针对刚入门.亦或是从 winform/bs转过来的开发人员快速入门的指南, 相对于其它一些文章中会详细的从项目如何建立到其实现的原理及组成部分, 本系列 ...