jQuery中的.height()、.innerHeight()和.outerHeight()
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()的更多相关文章
- Jquery中的 height(), innerHeight() outerHeight()区别
jQuery中的 height innerHeight outerHeight区别 标准浏览器下: height:高度 innerHeight:高度+补白 outerHeight:高度+补白+边框,参 ...
- Jquery中的height(),innerHeight(),outerHeight()的区别
前言 最近练习做弹窗,遇到height(),innerHeight(),outerHeight()的区别. 根据下面的盒模型来了解三者的区别. height():element的height; inn ...
- jQuery中的height()、innerheight()、outerheight()的区别总结
在前端jQuery代码中突然看到outerheight(),第一感觉就是,这是什么鬼?然后仔细查阅了一下,居然发现还有这么多相似的东西. 在jQuery中,获取元素高度的函数有3个,它们分别是heig ...
- jQuery中关于height,innerWidth与outerWidth的区别
jQuery width() 和 height() 方法 width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或外边 ...
- jquery 之height(),innerHeight(),outerHeight()方法区别详解
在jQuery中,获取元素高度的函数有3个,它们分别是height(). innerHeight().outerHeight(). 与此相对应的是,获取元素宽度的函数也有3个,它们分别是width() ...
- jQuery height()、innerHeight()、outerHeight()函数的区别详解
参考来源:http://www.jb51.net/article/84897.htm 代码示例(可复制到编辑器直接打开): <!DOCTYPE html> <html lang=&q ...
- jquery 对象的 height、innerHeight、outerHeight 的区别以及DOM 元素的 clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop
前言:jquery 对象的 height.innerHeight.outerHeight,还有 DOM 元素的 clientHeight.offsetHeight.scrollHeight.offse ...
- 关于height、offsetheight、clientheight、scrollheight、innerheight、outerheight的区别
二.也是平时经常用到的offsetheight 它返回的高度是内容高+padding+边框,但是注意哦,木有加margin哦,当然一般也木有啥需要把margin加进去的,以上代码为例,结果显示上图h2 ...
- jQuery中height()不能精确计算的问题
jQuery中关于高度的计算有三个方法:outerHeight().innerHeight().height() outerHeight():获取元素集合中第一个元素的当前计算高度值,包括paddin ...
随机推荐
- HDU1237 简单的计算器 【堆】+【逆波兰式】
简单的计算器 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Sub ...
- java编程规范之java命名规范
想要成为一个优秀的程序员,首先要培养良好的编程习惯,为了提高代码的可读性,必须有好的命名规范. 这篇文章是小编结合网上的很多资料整理出来的,若有不当或错误的地方,欢迎大家指正 在文章开始前,为方便阅读 ...
- Cookie rejected: Illegal path attribute "/nexus". Path of origin: "/content/" 解
问题叙述性说明 通过运行"mvn clean deploy" 命令 将 Maven 项目公布 Nexus 当PW.举例控制台输出以下警告消息: [INFO] Downloaded: ...
- java提高篇(十一)-----代码块
在编程过程中我们可能会遇到如下这种形式的程序: public class Test { { //// } } 这种形式的程序段我们将其称之为代码块,所谓代码块就是用大括号({})将多行代码封装在一起, ...
- ASP.NET自定义控件组件开发 第四章 组合控件开发CompositeControl 后篇 --事件冒泡
原文:ASP.NET自定义控件组件开发 第四章 组合控件开发CompositeControl 后篇 --事件冒泡 CompositeControl 后篇 --事件冒泡 系列文章链接: ASP.NET ...
- 玩转Web之Jsp(一)-----jsp中的静态包含(<%@include file="url"%>)与动态包含(<jsp:include>)
在jsp中include有两种形式,其中<%@include file="url"%>是指令元素,<jsp:include page="" f ...
- HDU ACM 1267 下沙的沙子有几粒?->DP
题意:m个H和n个D,从左開始数H的累积个数总不比D的累计数少的排列有多少种.比如,3个H和1个D共同拥有3种符合要求的排列H D H H,H H D H,H H H D. 分析:状态方程为,DP[ ...
- 一步一步学习ASP.NET 5 (三)- 认识新的Web结构
编者语 : 今天微软的两大盛事,早上有久违的Microsoft HEC 2015 晚上有DotnetConf 2015.假若你做微软的技术怎么能够错过呢?说说我的连载吧,前两篇分别介绍了ASP.NET ...
- 中国的手写输入法iOS8.1在崩溃
当中国的手写输入法.会导致app收起.于debug时刻.报错: 2014-10-22 14:45:10.269 App[524:170755] -[UIKBBlurredKeyView candida ...
- 解决win10开机出现C:\WIndows\system32\config\systemprofile\Desktop不可用 问题
背景:公司一台win10机子好久没用了,今天开了打算用下(打算远程桌面),远程桌面连不上(好久没用了,用户名都忘了),所以又插上显示器和键鼠. 键盘因为是PS/2接口,不能热插拔,所以开机一段时间后( ...