JQuery中的offset()和position()深入剖析

最新推荐文章于 2021-04-25 20:21:48 发布
最新推荐文章于 2021-04-25 20:21:48 发布
阅读量609 收藏
点赞数
分类专栏： jQuery 文章标签： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ernest128/article/details/8678625
版权

jQuery的offset()方法是获取匹配元素在当前视口的相对偏移；返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。

使用position()方法时事实上是把该元素当绝对定位来处理，获取的是该元素相当于最近的一个拥有绝对或者相对定位的父元素的偏移位置，如果其所有的父元素都为默认定位（static）方式，则其处理方式和offset()一样，是当前窗口的相对偏移。

jQuery的position()方法是获取匹配元素相对父元素的偏移；返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。

使用offset()方法不管该元素如何定位，也不管其父元素如何定位，都是获取的该元素相对于当前视口的偏移 。

ernest128
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
position和offset
sunhaomei的博客
07-09 283
原生JS中的三大家族（offset/scroll/client）与jQuery中对应的方法
我的地盘
05-16 376
JS中的offset家族： 一、offsetEWidth与offsetHeight： 获取的是元素的实际宽高 = width + border + padding 注意点： 1.可以获取行内及内嵌的宽高 2.获取到的值是一个number类型，不带单位 3.获取的宽高包含border和padding 4.只能读取，不能设置 console.log ( box.offsetWidth );/...
position与offset的区别
weixin_33725270的博客
08-09 182
.offset()是相对于文档（document）的当前位置,.position()是相对于父级元素的位移，一个元素可以嵌套多个position 转载于:https://www.cnblogs.com/family-626-77/p/5753205.html...
27.html的定位（position）和偏移量（offset）
越努力越幸运的博客
04-25 5292
文章目录定位偏移量（offset）相对定位绝对定位固定定位粘滞定位 定位 定位（position）是一种高级的布局手段，通过定位可以将元素摆放到页面的任意位置 可选值： static：默认值，元素静止，没有开启定位 relative：开启元素的相对定位 absolute：开启元素的绝对定位 fixed：开启元素的固定定位 sticky：开启元素的粘滞定位 偏移量（offset） 元素开启定位后，可以通过偏移量来设置元素的位置，偏移量有四个分别是 top：定位元素和定位位置上边的距离 bottom：定位元素和
jQuery中position()与offset()区别
weixin_34255793的博客
12-10 110
使用jQuery获取元素位置时，我们会使用position()或offset()方法，两个方法都返回一个包含两个属性的对象－左边距和上边距，它们两个的不同点在于位置的相对点不同。 可以看看下边的图：   从图中我们可以大体看出两者的区别。position()获取相对于它最近的具有相对位置(position:relative)的父级元素的距离，如果找不到这样的元素，则返回相对于浏览器的距离。o...
Jquery中的offset()和position()深入剖析
01-21
先看看这两个方法的定义。 offset(): 获取匹配元素在当前视口的相对... 先来看看在jquery框架源码里面，是怎么获得position()的： 代码如下: // Get *real* offsetParent var offsetParent = this.offsetParent(), /
Jquery中offset()和position()的区别分析
10-24
在进行网页开发时，定位元素是经常需要进行的操作，而在JQuery中，offset()和position()是用于获取元素位置的两个主要方法。它们虽然在某些情况下可以提供相似的结果，但这两个方法在使用上存在本质的区别。了解它们...
jQuery position() 函数详解以及jQuery中position函数的应用
11-22
`jQuery.position()`函数是jQuery库中的一个重要方法，用于获取页面中元素相对于其最近的定位祖先元素（即CSS position属性设置为absolute、relative或fixed的祖先）的偏移坐标。这个函数对于实现精确的元素布局和...
jquery-offset与position方法
小贺的博客
06-23 155
offset 方法 position 方法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>弹幕</title> <link rel="stylesheet" href="css/bootstrap.min.css...
js相对视口的高度_JavaScript与jQuery获取元素的宽、高和位置
weixin_30227789的博客
12-24 309
今天汇总整理了 JavaScript 和 jQuery 获取元素宽高和位置的方法，比较全面，方便自己和需要并搜到此文章的朋友们查看。先贴一下基础代码：#myDiv{height:300px;width:300px;margin:18pxauto;padding:15px;border:5pxsolid#dddddd;}vardiv=document.getElementBy...
jQuery-获取元素坐标(距离屏幕左侧上侧距离)
热门推荐
杨春建的博客
10-12 3万+
原文地址：https://shipengliang.com/html-css-javascript/jquery-%E8%8E%B7%E5%8F%96%E5%85%83%E7%B4%A0%E5%9D%90%E6%A0%87%E8%B7%9D%E7%A6%BB%E5%B1%8F%E5%B9%95%E5%B7%A6%E4%BE%A7%E4%B8%8A%E4%BE%A7%E8%B7%9D%E7%A6%B
jQuery获取动画中div元素的上下左右位置
LaySwift
07-02 1270
以&lt;div id=”date”&gt;&lt;/div&gt;为例 获取元素距离窗口顶部的位置 let top = $("#date").offset().top - $(document).scrollTop() 获取元素距离窗口底部的位置 let bottom = $(window).height()-[$("#date").offset().top - $(document...
jquery中offset()的源码分析
lzf的博客
10-23 820
jquery中，offset()函数用于设置或返回当前匹配元素相对于当前文档的偏移量，也就是相对于当前文档的坐标。 源码内部就是借用了getBoundingClientRect()方法。
JQuery position().top和offset().top的区别
椒盐薄荷糖
05-18 8378
Position():获取匹配元素集合中第一个元素的当前坐标。相对于偏移父元素。相对于offset parent的当前坐标值Offset():获取第一个元素的当前坐标，或者将每个元素的坐标设置为相对于文档的匹配元素集合。相对于偏移document。应用实例:点击edit，在下方添加一个编辑框，实现修改地址功能。每次都自动定位到当前正在编辑的按钮坐标。如图：代码实现：/**  * Add Addre...
js原生实现jquery方法offset()和position()
vcxiaohan的博客
08-19 5039
$(() => { console.log($('p').offset()) console.log($('p').position()) console.log(offset($('p')[0])) console.log(position($('p')[0])) // jquery offset原生实现 function offset(target)
jQuery 获取元素位置 offset() 和 position()
黄河爱浪的博客-专注CSS,jQuery,uni-app领域
09-09 2481
本篇文件向大家介绍的方法是offset()和position()，这两个方法有什么关系？下面的内容做详细介绍。 offset()功能描述：在匹配的元素集合中，获取的第一个元素的当前坐标，坐标相对于文档。 position()功能描述：获取匹配元素中第一个元素的当前坐标，相对于offset parent的坐标。( 注：offset parent指离该元素最近的而且被定位过的祖先元素 )...
offset()和position()的区别
whazhl的专栏
07-12 1184
一、Jquery中offset()   获取匹配元素在当前视口的相对偏移。 总是计算相对于文档的位置，无论元素的父元素或祖先元素的position属性是什么。 返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。
深入剖析jQuery源码：从构造到动画
7. **尺寸和大小Dimensions & Offset**：JQuery提供了获取和设置元素尺寸、偏移的方法，如`.width()`, `.height()`, `.offset()`. 分析这部分源码有助于理解元素几何属性的计算和应用。 8. **源码分析方法**：了解...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值