jquery height、innerHeight、outHeight

JQuery有很多的height，不总结一下你就要被他搞晕，所以为了保持清醒，汇总在下面

height：height

innerHeight：height+padding

outerHeight(false)（默认）：height+padding+border

outerHeight(true)：height+padding+border+margin

看到没有，他们是一个渐进的关系，范围越来越大，程序世界是一个需求的世界，有需方有求，看到这一点，这个世界好像变得简单了一点！

时间： 2024-10-02 03:11:38

jquery height、innerHeight、outHeight的相关文章

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

jQuery height().innerHeight().outerHeight()函数的区别详解在jQuery中,获取元素高度的函数有3个,它们分别是height(). innerHeight().outerHeight(). 与此相对应的是,获取元素宽度的函数也有3个,它们分别是width(). innerWidth().outerWidth(). 在这里,我们以height().innerHeight().outerHeight()3个函数为例,来详细介绍它们之间的区别. 下面我们以元

jQuery中的width()、heihgt()、innerWidth()、innerHeight()、outerWidth()和outerHeight()方法的区别

jQuery中的 width().innerWidth().outerWidth().outerWidth(true)和 height().innerHeight().outerHeight().outerHeight(true)方法的区别相信有些刚开始接触jquery的友友们,对这几个方法的区别总是模棱两可,似乎清楚似乎有是一个模糊的概念,下面是我自己整理的一张图,相信看了之后会对这几个方法有一个全新的认识.

jQuery 的 width()、height()、innerWidth()、innerHeight()、outWidth()、outHeight() 的区别

jQuery width() 和 height() 方法 width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或外边距). <!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"> </script> <script> $(document).

通过jQuery获取容器尺寸的方法height()、innerHeight()、outerHeight()的区别总结

在获取容器尺寸的时候,一定要分清是内部尺寸还是外部尺寸,避免出现bug不易查找,具体区别如下所示: height(): 其高度范围是所匹配元素的高度height: innerheight(): 其高度范围是所匹配元素的高度height+padding: outerheight(): 其高度范围是所匹配元素的高度height+padding+border: outerheight(true): 其高度范围是所匹配元素的高度height+padding+border+margin: 水平宽度的获取同

height、clientHeight、offsetHeight、scrollHeight、height()、 innerHeight()、outerHeight()等的区别

1.height height是css属性,这个属性定义元素内容区的高度,在内容区外面可以增加内边距.边框和外边距. 当 box-sizing: content-box 时,高度应用到元素的内容框. 当 box-sizing:border-box时,高度包含了内容框.内边距和边框. 2.clientHeight Element.clientHeight只读属性是没有的CSS或内联布局框元素为零,否则它的像素单元内的高度,但不包括填充水平滚动条的高度,边界或边缘. // 包含元素的conten

jQuery height()、innerHeight()、outerHeight()函数的区别

参考: http://www.365mini.com/tech 函数高度范围 jQuery版本支持写操作 height() height 1.0+ 1.0+ innerHeight() height + padding 1.2.6+ 1.8.0+ outerHeight() height + padding + border 1.2.6+ 否 outerHeight(true) height+padding+border+margin 1.2.6+ 否

jQuery中width、innerWidth、outerWidth的区别

原文:摘自http://www.canaansky.com/blog/107/ 在css的盒子模型中,最内部是content area,然后是padding.border.margin 那么width其实就是content area,innerWidth = width + paddingouterWidth = innerWidth + border 不过,jQuery的outerWidth属性还可以传递一个参数,那么:outerWidth(true) = outerWidth + margi

jQuery使用（十）：jQuery实例方法之位置、坐标、图形（BOM）

offset() position() scrollTop().scrollLeft width().height() innerWidth().outerWidth().innerHeight().outerWidth() jQuery坐标图形大小相关 offset() 返回或设置元素距离浏览器的距离{top,left} 设置浏览器距离会累计父级的浏览器距离,当设置值小于父级相对浏览器距离时会出现负样式值. 具体参数和使用方法参考手册:http://www.runoob.com/jquery/

05 - outerHeight、outerWidth 和 innerWidth、innerHeight 和 width() height()

一.jQuery方法 outerWidth() 和 outerHeight() 1.outerWidth() - 方法返回第一个匹配元素的外部宽度. - 返回第一个匹配元素的外部宽度.该宽度= content + padding + border - 如需包含 margin,使用 outerWidth(true).该宽度= content + padding + border + margin <style> .box { width: 200px; height: 200px; pad