这里的实现也很容易懂,通过jQuery的静态方法each给jQuery的原型添加scrollLeft和scrollTop方法。

这里在取值时它把window和普通的element做了区分

如果是window,就使用window.pageXOffset window.pageYOffset获取

如果是element,就通过element.scrollLeft element.scrollTop获取。

关于pageXOffset,MDN中介绍:

var x = (window.pageXOffset !== undefined)
? window.pageXOffset
: (document.documentElement || document.body.parentNode || document.body).scrollLeft; var y = (window.pageYOffset !== undefined)
? window.pageYOffset
: (document.documentElement || document.body.parentNode || document.body).scrollTop;
jQuery.each( { scrollLeft: "pageXOffset", scrollTop: "pageYOffset" }, function( method, prop ) {
var top = "pageYOffset" === prop; jQuery.fn[ method ] = function( val ) {
//调用access全局方法
//access内部会调用method(elem[0],val)
return access( this, function( elem, method, val ) {
var win = getWindow( elem );//是不是window
if ( val === undefined ) {//如果val为undefined
//如果win存在,返回window[prop] prop是对象的键值
//如果不存在,返回elem[method] method是对象的键名
return win ? win[ prop ] : elem[ method ];//window.pageXOffset 或者 elem.scrollLeft
}
//下面是设置值
if ( win ) {//$(window) $(document)
win.scrollTo(
!top ? val : window.pageXOffset,
top ? val : window.pageYOffset
); } else {
elem[ method ] = val;
}
}, method, val, arguments.length, null );
};
});

jQuery scrollLeft()与scrollTop() 源码解读的更多相关文章

  1. 第二十五课:jQuery.event.trigger的源码解读

    本课主要来讲解jQuery.event.trigger的源码解读. trigger = function(event, data, elem, onlyHandlers){ if(elem & ...

  2. jQuery prop() 与 removeProp()源码解读

    prop() prop: function( elem, name, value ) { var ret, hooks, notxml, nType = elem.nodeType; // don't ...

  3. jQuery插件pagination.js源码解读

    pagination的github地址:https://github.com/gbirke/jquery_pagination 公司用的是1.2的版本,所以我就读1.2的了. jQuery.fn.pa ...

  4. 第二十四课:jQuery.event.remove,dispatch的源码解读

    本课还是来讲解一下jQuery是如何实现它的事件系统的.这一课我们先来讲一下jQuery.event.remove的源码解读. remove方法的目的是,根据用户传参,找到事件队列,从里面把匹配的ha ...

  5. 第二十三课:jQuery.event.add的原理以及源码解读

    本课主要来讲解一下jQuery是如何实现它的事件系统的. 我们先来看一个问题: 如果有一个表格有100个tr元素,每个都要绑定mouseover/mouseout事件,改成事件代理的方式,可以节省99 ...

  6. jQuery.Callbacks 源码解读二

    一.参数标记 /* * once: 确保回调列表仅只fire一次 * unique: 在执行add操作中,确保回调列表中不存在重复的回调 * stopOnFalse: 当执行回调返回值为false,则 ...

  7. jquery源码解读

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐进增强)优雅的处理能 ...

  8. jQuery源码解读----part 2

    分离构造器 通过new操作符构建一个对象,一般经过四步: A.创建一个新对象 B.将构造函数的作用域赋给新对象(所以this就指向了这个新对象) C.执行构造函数中的代码 D.返回这个新对象 最后一点 ...

  9. jquery中的 parseJSON() 源码分析

    parseJSON: function( data ) { // Attempt to parse using the native JSON parser first if ( window.JSO ...

随机推荐

  1. Java线程池技术以及实现

    对于服务端而言,经常面对的是客户端传入的短小任务,需要服务端快速处理并返回结果.如果服务端每次接受一个客户端请求都创建一个线程然后处理请求返回数据,这在请求客户端数量少的阶段看起来是一个不错的选择,但 ...

  2. Oracle在Java中事物管理

    对于 对数据库中的数据做dml操作时,能够回滚,这一事物是很重要的 下面例子是对数据库中数据进行修改 package com.demo.oracle; import java.sql.Connecti ...

  3. Struts2 Action 匹配的几种方式

    下面针对我所遇见的Action的配置方法进行一下总结: 1.基本的匹配方法

  4. css控制字符长度超出变成点点点显示(单行,多行)

    css控制字符长度超出变成点点点显示 单行: width 必不可少 div{ width: 55%; text-overflow: ellipsis; overflow: hidden; white- ...

  5. CISCO-路由器交换机密码恢复

    路由器密码恢复: 准备工作:一台PC跟一台路由器用console线相连 工作原理:如果忘记密码被锁在路由器外,通过修复寄存器值来进行修复 默认的寄存器值为0x2102(关闭的),若要恢复口令需要开启这 ...

  6. 工艺(SAM)

    传送门 用SAM可以非常轻松的解决问题. 只要把原串向SAM中插入两次,之后直接从\(t_0\)状态开始每次贪心跑最小就可以了. 因为这个题要用map,所以之前取begin即可. // luogu-j ...

  7. P1115最大子段和

    题目:https://www.luogu.org/problemnew/show/P1115 很简明的一道题: 这里用了递归分治,然而似乎还有更简单的做法(贪心). 代码如下: #include< ...

  8. 爬虫库之BeautifulSoup学习(四)

    探索文档树: find_all(name,attrs,recursive,text,**kwargs) 方法搜索当前tag的所有tag子节点,并判断是否符合过滤器的条件 1.name参数,可以查找所有 ...

  9. Linux系统如何查看版本信息?

    查看版本号 我在Ubuntu下做测试 1 命令行执行 cat /etc/issue  (切记cat后要空一格)即可看到版本信息. 2 登录linux,在终端输入 cat /proc/version  ...

  10. MyEclipse控制台console自动跳动的解决方案

    有时候Eclipse启动,控制台console不会自动跳出来,需要手工点击该选项卡才行 按下面的设置,可以让它自动跳出来(或不跳出来): windows  ->   preferences   ...