jQuery中的.height()、.innerHeight()和.outerHeight()和W3C的盒模型相关的几个获取元素尺寸的方法。对应的宽度获取方法分别为.width()、.innerWidth()和.outerWidth(),在此不详述。

1. .height()

获取匹配元素集合中的第一个元素的当前计算高度值 或 设置每一个匹配元素的高度值(带一个参数)。

注意:1).css('height').height()之间的区别是后者返回一个没有单位的数值(例如,400),前者是返回带有完整单位的字符串(例如,400px)。

2).height()总是返回内容宽度,不管CSSbox-sizing属性值。.height('value')设置的容器宽度是根据CSSbox-sizing属性来定的,
将这个属性值改成border-box,将造成这个函数改变这个容器的outerHeight,而不是原来的内容高度。

2. .innerHeight()

为匹配的元素集合中获取第一个元素的当前计算高度值,包括padding,但是不包括border。

3. .outerHeight()

获取元素集合中第一个元素的当前计算高度值,包括padding,border和选择性的margin。返回一个整数(不包含“px”)表示的值
,或如果在一个空集合上调用该方法,则会返回 null。

.outerHeight()计算中总是包含padding-top
,padding-bottom 和 border-top,border-bottom ;如果includeMargin参数是true,那么margin
(top 和 bottom)也会被包含。

jQuery中的.height()、.innerHeight()和.outerHeight()的更多相关文章

  1. Jquery中的 height(), innerHeight() outerHeight()区别

    jQuery中的 height innerHeight outerHeight区别 标准浏览器下: height:高度 innerHeight:高度+补白 outerHeight:高度+补白+边框,参 ...

  2. Jquery中的height(),innerHeight(),outerHeight()的区别

    前言 最近练习做弹窗,遇到height(),innerHeight(),outerHeight()的区别. 根据下面的盒模型来了解三者的区别. height():element的height; inn ...

  3. jQuery中的height()、innerheight()、outerheight()的区别总结

    在前端jQuery代码中突然看到outerheight(),第一感觉就是,这是什么鬼?然后仔细查阅了一下,居然发现还有这么多相似的东西. 在jQuery中,获取元素高度的函数有3个,它们分别是heig ...

  4. jQuery中关于height,innerWidth与outerWidth的区别

    jQuery width() 和 height() 方法 width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或外边 ...

  5. jquery 之height(),innerHeight(),outerHeight()方法区别详解

    在jQuery中,获取元素高度的函数有3个,它们分别是height(). innerHeight().outerHeight(). 与此相对应的是,获取元素宽度的函数也有3个,它们分别是width() ...

  6. jQuery height()、innerHeight()、outerHeight()函数的区别详解

    参考来源:http://www.jb51.net/article/84897.htm 代码示例(可复制到编辑器直接打开): <!DOCTYPE html> <html lang=&q ...

  7. jquery 对象的 height、innerHeight、outerHeight 的区别以及DOM 元素的 clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop

    前言:jquery 对象的 height.innerHeight.outerHeight,还有 DOM 元素的 clientHeight.offsetHeight.scrollHeight.offse ...

  8. 关于height、offsetheight、clientheight、scrollheight、innerheight、outerheight的区别

    二.也是平时经常用到的offsetheight 它返回的高度是内容高+padding+边框,但是注意哦,木有加margin哦,当然一般也木有啥需要把margin加进去的,以上代码为例,结果显示上图h2 ...

  9. jQuery中height()不能精确计算的问题

    jQuery中关于高度的计算有三个方法:outerHeight().innerHeight().height() outerHeight():获取元素集合中第一个元素的当前计算高度值,包括paddin ...

随机推荐

  1. 解决iOS app集成共享QQ场地,微信的朋友,朋友等功能圈,不能采用苹果公司的审计问题

    最近提交的应用程序App Store时刻,由于App综合QQ登录.份额QQ场地.微信等功能.被拒绝.很郁闷:在最佳.想想办法,这个问题是可以解决. 当共享平台列表显示.根据推断当前设备被安装在一节Ap ...

  2. [BEROR]CodeSign error: code signing is required for product type &#39;Application&#39; in SDK &#39;iOS 8.1&#39;

    解决方法: 选择project->Build Settings -> Code Signing -> Code Signing Identity -> Debug -> ...

  3. 2.大约QT数据库操作,简单的数据库连接操作,增删改查数据库,QSqlTableModel和QTableView,事务性操作,大约QItemDelegate 代理

     Linux下的qt安装,命令时:sudoapt-get install qt-sdk 安装mysql数据库,安装方法參考博客:http://blog.csdn.net/tototuzuoquan ...

  4. MAC随机修改批处理

    原文:MAC随机修改批处理 @echo off mode con cols=70 lines=20 title MAC随机修改工具 color 3F setlocal enabledelayedexp ...

  5. cocos2d-html5

    cocos2d-html5 简单的混乱 在正常情况下,build设置完毕后 跑ant编 变更后cocos2d.js 简单直观so easy 只需要上传cocos2d.js/game.js/index文 ...

  6. dapper支持oracle游标

    dapper支持oracle游标 Dapper是一个轻型的ORM类.它有啥优点.缺点相信很多朋友都知道了,园里也有很多朋友都有相关介绍,这里就不多废话. 如果玩过Oracle都知道,存储过程基本都是通 ...

  7. 搜索引擎排名不友好的五个地点-SEO

    搜索引擎(百度/谷歌/雅虎)排名不友好的五个地点 别的站点,推断标准和考核得分点是不 一样的,避免对百度排名不友好的五种站点操作 你的站点是否在这五种站点里,决定你的站点能否获得排 名. 1.有没有同 ...

  8. TempDB 中表变量和局部临时表的对比

    原文:TempDB 中表变量和局部临时表的对比 参考资料来源: http://blogs.msdn.com/b/sqlserverstorageengine/archive/tags/tempdb/ ...

  9. tornado的GET POST方法样品展示

    举例说明get和post该方法的用途: 一.演示样例用的GET方法: import tornado.ioloop import tornado.web class MainHandler(tornad ...

  10. spring多数据源的配置(转)

    C3P0和DBCP的区别 C3P0是一个开源的JDBC连接池,它实现了数据源和JNDI绑定,支持JDBC3规范和JDBC2的标准扩展.目前使用它的开源项目有Hibernate,Spring等.   d ...