话不多说先上图：

offset()的top是指元素与document的上边的距离，而不是浏览器当前窗体的上边缘，如图

document高度超过window，浏览器出现滚动条，滚动滚动条，提交按钮的offset不变。

总结一下：offsetTop是当前对象到其上级层顶部的距离.

不能对其进行赋值.设置对象到页面顶部的距离请用style.top属性.

JQ中的 offsetTop 和 offset().top 的区别的更多相关文章

  1. JQ的offset().top与js的offsetTop区别详解

    一.前言 最近在做一个图片懒加载的插件,就纵轴(Y轴)而言,我需要时时获取图片的上偏移量,好判断是否已进入视图区域,而我所理解的是offsetTop应该是跟offset().top一样的,然后陷入了因 ...

  2. JQ的offset().top与JS的getBoundingClientRect区别详解，JS获取元素距离视窗顶部可变距离

     壹 ❀ 引 我在 JQ的offset().top与js的offsetTop区别详解 这篇博客中详细分析了JQ方法offset().top与JS属性offsetTop的区别,并得出了一条offset( ...

  3. jquery的offset().top和js的offsetTop的区别，以及jquery的offset().top的实现方法

    jquery的offset().top和js的offsetTop的区别,以及jquery的offset().top的实现方法 offset().top是JQ的方法,需要引入JQ才能使用,它获取的是你绑 ...

  4. jquery的offset().top与javascript的offsetTop区别？

    offset().top是jquery的方法,需引入jquery,它获取你绑定元素上边框相对于html上边界的偏移量 offsetTop是原生js的方法,它获取你绑定元素上边框相对于离自己最近且pos ...

  5. div设置overflow-scroll滚动之后，jq获取其子元素的offset.top出现问题。

    先上个图: 布局很简单,左右超过屏幕的部分自行滚动. 1. html <div class="ce-container"> <div class="ce ...

  6. jQuery中animate与scrollTop、offset().top实例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. jquery的offset().top 和position().top 详解 和如何用js实现

    1 jquery定义: offset().top 相对于当前文档的坐标(的高度) ps:包括滚动条卷去的高度 position().top 返回的是相对于其定位的祖辈元素的坐标(的高度) ps:包括滚 ...

  8. javascript中常用坐标属性offset、scroll、client

    原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...

  9. jq中

    1.jquery位置信息 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

随机推荐

  1. P2602 [ZJOI2010]数字计数

    https://www.luogu.org/problemnew/show/P2602 数位dp #include <bits/stdc++.h> using namespace std; ...

  2. pthread_create()

    pthread_create()创建的线程没有执行,试了好几遍.非常郁闷.后来发现主线程没有睡眠,新创建的线程还没来的及执行主线程就退出了,所以没有执行.

  3. java中异常的面试

    https://blog.csdn.net/qq_36523638/article/details/79363652 1) Java中的检查型异常和非检查型异常有什么区别? 这又是一个非常流行的Jav ...

  4. MySql 5.7.23安装

    1.首先上MySql的官网下载  https://dev.mysql.com/downloads/mysql/ 选择源码包: 1. 新建/usr/local/src目录,保存下载的各类安装包 1 mk ...

  5. C# Excel转换成Json工具（含源码）

    可执行版本下载:https://github.com/neil3d/excel2json/releases 完整项目源代码下载:https://github.com/neil3d/excel2json ...

  6. qml：基本知识记录

    1.  property信号处理函数: 在qml中,通过property可以定义属性,这些属性自带信号处理函数,例如: property   string    szTitle: “hello wor ...

  7. 缓存淘汰策略之LRU

    LRU(Least recently used,最近最少使用)算法根据数据的历史访问记录来进行淘汰数据,其核心思想是“如果数据最近被访问过,那么将来被访问的几率也更高”. 1. 新数据插入到链表头部: ...

  8. 【.NET】using 语句中使用的类型必须可隐式转换为"System.IDisposable"

    #问题: 在使用EF开发中,出现如下错误:“using 语句中使用的类型必须可隐式转换为“System.IDisposable” #原因: 项目中没有引用 EntityFramework 这个程序集: ...

  9. sqlserver修改计算机名称。

    SELECT @@SERVERNAME As [@@SERVERNAME], CAST(SERVERPROPERTY('MACHINENAME') AS VARCHAR(128)) + COALESC ...

  10. EL表达式获取日期时间类型后格式化的问题

    最近在项目中遇到的问题,就是从后台取到的java.util.Date类型的数据,在前台需要格式化的问题. 开始想了很多办法,其实在JSP页面中处理很简单,JSTL提供的format标签即可解决这个问题 ...