我们都知道obj.offsetHeight与obj.style.height都可以获取obj的高度，但是在js使用中，我们通常会使用前者来获取高度，这是为什么，二者有什么样的区别呢。

1、obj.offsetHeight可以获取写在样式文件里的属性值，而obj.style.height只能获取行内属性，在表现与结构分离的今天，这显然是不合适的
 
2、obj.offsetHeight返回的是一个数值，而obj.style.height返回的是一个字符串，单位是“px”
 
3、obj.offsetHeight是只读，而obj.style.height是可读写
 
4、如果没有为元素设置高度，obj.offsetHeight会根据内容获取高度值，而obj.style.height会返回undefind
 
jQuery里我们使用$(obj).height()来获取元素的高度，（$(obj).css('height')返回的是一个带有单位的字符串）。
与其他三个（$(obj).height()、$(obj).css('height')、obj.style.height）不同的是，obj.offsetHeight的高度就是height+padding,其他是不把padding计入高度的

obj.offsetHeight与obj.style.height区别的更多相关文章

  1. obj.offsetHeight与obj.style.height $(obj).height()与$(obj).css('height')

    相同:都可以获取obj的高度区别:(1)obj.offsetHeight可以获取外部.内嵌和内联中定义的高,而obj.style.height只能获取内联中定义的高:(2)obj.offsetHeig ...

  2. clientHeight ,offsetHeight,style.height,scrollHeight有区别与联系

    style.height 包括 元素的滚动条,不包括边框clientHeight 不包括元素的滚动条和边框,只有在没有元素的滚动条的情况下,style.height相等于clientHeightoff ...

  3. 浅谈style.height、clientHeight、offsetHeight、scrollHeight

    先分别介绍以下,以下资料来自MDN HTMLElement.offsetHeight 是一个只读属性,它返回该元素的像素高度,高度包含该元素的垂直内边距和边框,且是一个整数. Element.clie ...

  4. instanceof和isInstance(Object obj) 和isAssignableFrom(Class cls)的区别和联系

    instanceof和isInstance(Object obj) 和isAssignableFrom(Class cls)的区别和联系          编程的时候可能会遇到一个不知道它属于哪个类的 ...

  5. style.height、offsetHeight、clientHeight、scrollHeight的差别

    style.height 包含元素的滚动栏,不包含边框 clientHeight 不包含元素的滚动栏和边框 offsetHeight 包含元素的滚动栏和边框 scrollHeight offsetHe ...

  6. js 浏览器窗口大小改变 高度 宽度获取 window/document.height()区别

    <script> //当浏览器的窗口大小被改变时触发的事件window.onresize window.onresize = function(){ console.log($(windo ...

  7. 小问题填坑，关于obj.x和obj["x"]

    之前在看对象的api中for in函数时,有一个地方让我略有疑惑: var obj={ x:100, y:200, z:300 }; for(var key in obj){ if(obj.hasOw ...

  8. VS发布web应用程序报：无法识别的特性“xmlns:xdt”。请注意特性名称区分大小写 或 未能将文件obj\...复制到obj\...未能找到路径

    问题1:无法识别的特性“xmlns:xdt”.请注意特性名称区分大小写 问题2:未能将文件obj\...复制到obj\...未能找到路径 解决办法:将web项目文件下的obj文件夹从项目中排除,然后再 ...

  9. 多.h项目出现的问题：使用了预编译头依然出现error LNK2005:***obj已在***obj中定义与c++ error C2011: “xxx”:“class”类型重定义解决办法

    使用了预编译头依然出现error LNK2005:***obj已在***obj中定义 造成该问题的可能性比较多,本人将在今后遇到时添加进来,今天先放出本人遇到的一种情况. 多重包含含有变量定义的.h文 ...

随机推荐

  1. Spring MVC 基础注解之@RequestMapping、@Controller、(二)

    我现在学的是spring4.2 今天主要学习了Spring MVC注解 引入注解可以减少我们的代码量,优化我们的代码. @Controller:用于标识是处理器类: @RequestMapping:请 ...

  2. $.each 与$().each()

    在jquery中,遍历对象和数组,经常会用到$().each和$.each(),两个方法.两个方法是有区别的,从而这两个方法在针对不同的操作上,显示了各自的特点. $().each,对于这个方法,在d ...

  3. OpenCV3编程入门笔记（2）计时函数、感兴趣区域RIO、分离/混合通道

    11     绘制直线的line函数 DrawLine(Mat img, Pont start, Point end); 绘制椭圆的ellipse函数 DrawEllipse(Mat img, dou ...

  4. VC++调试说明

    目录 第1章调试说明    1 1.1 调试设置    1 1.2 跟踪代码    2 1.3 断点    2 第2章模块生命周期    4 2.1 exe模块    4 2.2 dll模块    5 ...

  5. font-face字体文件引入方式

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  6. 1.3 ASP.NET MVC生命周期

    ASP.NET MVC的执行生命周期主要分为三个阶段,分别是网址路由对比.执行控制器与动作.执行视图并返回结果.从ASP.NET MVC接受HTTP请求到返回HTTP响应的过程如下图所示.

  7. jmeter笔记5

    性能测试是任何分布式或Web应用程序测试计划的重要组成部分.在计划和开发周期中进行性能评价,可以保证交付给客户的应用程序满足客户对于高负载.可用性和可伸缩性的要求.提前确定软件的负载限制可以为适当地进 ...

  8. robotframework笔记24

    侦听器接口 机器人框架有一个侦听器接口,可以用于接收 对测试执行通知. 示例用法包括 外部测试监控,测试失败时发送邮件消息, 与其他系统进行通信. 侦听器API版本3也使得 它可以修改测试在测试执行和 ...

  9. spring来了-05-JDBC

    概述 Spring对C3P0连接池的支持很完善 Spring对jdbc提供了JdbcTemplate,来简化jdbc操作, JdbcTemplate模板工具类,类似于DbUtils组件 JDBC: p ...

  10. CentOS报错：Could not retrieve mirrorlist http://mirrorlist.centos.org/?release=7&arch=x86_64&repo=os&infra=stock32 error was 14: curl#6 - "Could not resolve host: mirrorlist.centos.org; Unknown error"

    今天安装完带图形界面的CentOS 7后,在Terminal中运行yum安装命令时报了以下错误: Could not retrieve mirrorlist http://mirrorlist.cen ...