jQuery 1.9.1源码分析系列（十三）之位置大小操作

这篇文章将带领大家深入了解jQuery 1.9.1源码中的位置大小操作系列。对于热爱前端开发的朋友们来说，这无疑是一份宝贵的参考资料。

让我们聚焦于jQuery中的`.css()`方法。这个方法被用于设置或返回当前jQuery对象所匹配的元素的CSS样式属性值。如果你想要获取某个CSS属性的值，只需调用`.css()`并传入对应的属性名即可。而如果你想要设置属性值，只需在属性名后加上等号以及你想要设置的值。值得注意的是，`.css()`方法中的所有"设置"操作都是针对当前jQuery对象所匹配的每一个元素进行的，而所有"读取"操作则只针对第一个匹配的元素。

接下来，我们来看看`.offset()`方法。这个方法用于设置或返回当前匹配元素相对于当前文档的偏移坐标。换句话说，它返回的是元素在文档中的位置。这个方法只对可见元素有效，并返回一个包含`left`和`top`属性的坐标对象。这些属性的值都是数字，表示的是元素的位置偏移量，单位是像素。与`.position()`方法不同的是，`.offset()`返回的是相对于当前文档的坐标，而`.position()`返回的是相对于其定位的祖辈元素的坐标。

再来说说`.position()`方法。这个方法返回当前匹配元素相对于其定位的祖辈元素的偏移坐标。与`.offset()`类似，它也只对可见元素有效，并返回一个坐标对象。这个坐标对象表示的是元素相对于其祖辈元素的位置。要注意的是，只有元素的CSS `position`属性值不为`static`时，`.position()`方法才能返回有效的结果。

我们还有`.scrollLeft()`和`.scrollTop()`这两个方法，它们分别用于设置或获取元素相对于水平或垂直滚动条的偏移量。当一个元素的实际尺寸超过其显示区域时，浏览器会为该元素显示相应的滚动条，这时就可以通过这两个方法来获取或设置元素的偏移量。

我们来看看关于元素尺寸的方法。`.height()`方法用于设置或获取当前匹配元素的高度，不包括外边距、内边距和边框等部分的高度。如果你想要获取包括某部分在内的高度，可以使用`nerHeight()`方法来获取元素的内高度，或者使用`.outerHeight()`方法来获取元素的外高度，这个方法还包括了内边距和边框，但不包括外边距。

借助孤月蓝风的详解图，我们来深入jQuery中的几个关键函数：offset、position、width、innerWidth以及outerWidth。这些函数在前端开发中极为重要，它们能够帮助我们获取元素的尺寸和位置信息，甚至对元素进行定位设置。

我们来看看jQuery.fn.offset。这是一个获取或设置元素位置的重要函数。在获取时，它的计算方式是基于元素相对于视窗的位置以及文档被卷起的部分的高度。在IE8和现代浏览器之间，存在一些细微的差异，这需要我们注意。在设置offset时，我们需要注意元素的position属性，如果为static，需要先设置为relative。然后，根据要设置的offset值和当前元素的offset值，计算出新的css特征值并设置给元素。

接下来是jQuery.fn.position。这个函数只能获取元素的位置信息，不能设置。它的计算方式是元素的offsetTop减去元素被定位的祖辈元素的offsetTop，再减去元素的marginTop值。这里，jQuery将width、padding、border和margin看作一个整体，因此得到的是这个整体距离被定位祖辈元素顶部内边的距离。

除了获取位置信息，我们还需要关注元素的尺寸。这时，我们可以使用width、innerWidth和outerWidth这三个函数。width获取的是元素本身的宽度，包括padding和border，但不包括margin。innerWidth获取的是元素的内部宽度，即width加上padding的值。而outerWidth则考虑了元素的margin宽度。在使用这些函数时，我们需要注意不同浏览器之间的兼容性问题。

jQuery 1.9.1源码系列（十三）—— 位置与大小操作的艺术

在前端开发中，我们经常需要处理元素的定位与大小，jQuery为我们提供了强大的工具来处理这些任务。我们将深入jQuery 1.9.1版本源码中关于位置与大小的操作。

一、元素的位置处理

在jQuery中，处理元素的位置主要包括获取元素的偏移量以及滚动条的位置。让我们关注如何获取元素的偏移量。

在源码中，有一个重要的处理过程，当元素为fixed定位时，它的被定位的祖辈元素实际上是window视窗。我们可以通过元素的getBoundingClientRect方法直接获取其偏移量。而对于其他定位的元素，我们需要先获取其offsetParent，然后计算其偏移量。在计算过程中，还需要考虑边框的影响，并减去元素自身的上边距。

二、offsetParent的获取

在jQuery中，我们可以通过offsetParent()函数获取最近的祖先定位元素。这个函数会返回一个元素集合，每个元素都是原始元素的最近的定位祖先。在获取过程中，如果遇到的祖先元素是静态定位并且不是html元素，则继续向上寻找，直到找到定位祖先或者html元素。

三、滚动条位置的获取与设置

对于滚动条位置的获取和设置，jQuery提供了scrollLeft和scrollTop这两个函数。获取滚动条位置相对简单，可以使用window的pageYOffset属性或者元素的scrollTop属性。而设置滚动条位置则直接使用window的scrollTo方法或者元素的scrollTop属性。

以上是长沙网络推广为大家带来的关于jQuery 1.9.1源码分析系列的第十三篇文章，希望大家喜欢。让我们一起深入理解jQuery源码，前端开发的奥秘。

通过cambrian.render('body')语句，将文章内容呈现给读者。这篇文章的内容丰富、生动，并深入了jQuery源码中关于位置与大小操作的部分，相信读者在阅读后会有很大的收获。