通过在线实例来演示jquery里width、innerWidth、outerWidth的区别亲测 原创


  • :
  • 04-27 15:41
  • :
  • 38次
  • :
  • 0条
  • 0赞

简介本文通过一个非常具体的在线实例,来向你演示jquery里width height innerWidth innerHeight outerWidth outerHeight的区别。

jquery里和宽高相关的函数有:width height innerWidth innerHeight outerWidth outerHeight,下面是官网给出的相关解释和含义:

width:取得第一个匹配元素当前计算的宽度值
height:取得匹配元素当前计算的高度值

innerWidth:获取第一个匹配元素内部区域宽度(包括补白、不包括边框)。
innerHeight:获取第一个匹配元素内部区域高度(包括补白、不包括边框)。

outerWidth:获取第一个匹配元素外部宽度(默认包括补白和边框)。
outerHeight:获取第一个匹配元素外部高度(默认包括补白和边框)。

上面解释里的“补白”,其实说的就是padding了,来看站长准备的一个在线实例:

jquery里width,height,innerWidth,innerHeight,outerWidth,outerHeight的在线演示

通过这个实例我们很仔细的可以看出:

width:获取元素的宽度,不包括边框和padding
height:获取元素的高度,不包括边框和padding

innerWidth:获取元素的宽度,包括padding 
innerHeight:获取元素的高度 包括padding

outerWidth:获取元素的宽度  包括padding 和边框
outerHeight:获取元素的高度 包括padding 和边框

好了,关于jquery里 width innerWidth 和outerWidth就介绍到这里!



您正在找的文章可能是: