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 ...
随机推荐
- 64位内核注冊tty设备
在64位系统中,注冊tty设备须要注意的是,Android跑在EL0而且在32位模式下,kernel跑在EL1而且在64位模式下,不但内核须要打开CONFIG_COMPAT选项,非常多android上 ...
- bash组织成树数据结构
君子也非独占,善假于物!bash也因此.昨天晚上,今天早上世界杯很精彩.晚上醒来看到不断地居住的电话.早上没有喝的水开始赞赏在英国和意大利的对决.也TM精彩,最后生下了罗马文化.意大利伊特鲁里亚文化获 ...
- DataGridView大扩展——显示行号
原文 DataGridView大扩展——显示行号 在DataGridView 的实际使用中,经常需要标示出行号,这样可以比较醒目地看到当前信息.不过DataGridView 在绘制 DataGridV ...
- Android多点触控(图片的缩放Demo)
本文主要介绍Android的多点触控,使用了一个图片缩放的实例,来更好的说明其原理.须要实现OnTouchListener接口,重写当中的onTouch方法. 实现效果图: 源码: 布局文 ...
- 经excel要将数据库(ORACLE)要插入数据
大家都知道PL/SQL可以excel数据复制.我们也可以通过相同excel将数据插入到数据库. 下面我们就来简单的样品,并与主题演示 首先,我们创建了一个表test CREATE TABLE test ...
- 【Java基金会】Java整理面试问题和评论(一)
1. ArrayList,Vector, LinkedList 存储性能及特点 ArrayList 和 Vector 都是使用数组方式存储数据,此数组元素数大于实际存储的数据以便添加和插入元素,它们都 ...
- iOS 中client和server的 Web Service 网络通信 (2)
在实际的应用开发过程中,同步请求的用户体验并非非常好:我们都知道.Apple是非常重视用户体验的.这一点也成为了行业的标杆,没实用户哪里来的好产品.所以用户体验是极其重要的.貌似废话有点多.接下来进入 ...
- 2015广东工业大学ACM学校巡回赛 I 游戏高手 (如压力dp)
Problem I: 游戏王 Description 小学的时候,Stubird很喜欢玩游戏王.有一天,他发现了一个绝佳的连锁组合,这个连锁组合须要6张卡. 但是他一张都没有,但是他的那些朋友们有.只 ...
- 基于高性能的硬件配置Nginx
Nginx高级配置将涉及硬件,假设你配置不好,直接使各种性能下降. 我这里总结一下.怎样依据server的硬件设备来配置Nginx. 见下图: 低訪问量的网络,能够这样配置. 标准的网络訪问量,能够这 ...
- Android:创建耐磨应用 - 语音操作
加入语音处理能力(Adding Voice Capabilities) 语音操作为用户体验可穿戴的重要组成部分,它允许用户快速.免提方式来运行操作. Wear它提供了两种类型的语音操作的: 该系统提供 ...