jQuery 源码基本框架
抽丝剥茧, 7000+ 行的 jQuery 源码基本可以概括为以下的伪代码
(function (window, undefined) {
//将 document 封装成 jQuery 对象并缓存
var rootjQuery, //dom ready 事件的委托队列
readyList, //快速地识别 html 标记 如 <div> 或者 #id
rquickExpr = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/, jQuery = function (selector, context) {
return new jQuery.fn.init(selector, context, rootjQuery);
}; jQuery.fn = jQuery.prototype = {
constructor: jQuery,
init: function (selector, context, rootjQuery) { // $(""), $(null), $(undefined), $(false)
if (!selector) {
return this;
} var match = rquickExpr.exec(selector); // $('<div></div>')
jQuery.parseHTML(match[1])
return this; // $(#id)
return document.getElementById(selector); // $('.class'), $('.class', context), $('#class', context)
// 其中 context 是jQuery元素
return (context || rootjQuery).find(selector); // $('.class', domElm)
return this.constructor(context).find(selector); // selector is function
return rootjQuery.ready(selector); return jQuery.makeArray(selector, this);
},
ready: function (fn) {
// Add the callback
jQuery.ready.promise().done(fn); return this;
}
} jQuery.init.prototype = jQuery.fn; jQuery.extend = jQuery.fn.extend = function () {
}; rootjQuery = jQuery(document); // Sizzle 代码
(function (window, undefined) { function Sizzle(selector, context, results, seed) {
if (support.qsa) {
return querySelectorAll(selector)
} return select(selector.replace(rtrim, "$1"), context, results, seed);
} function select(selector, context, results, seed) {
var match = tokenize(selector);
} function tokenize(selector, parseOnly) { } jQuery.find = Sizzle;
})(window); // 对 jQuery 对象的扩展
jQuery.extend({}); // 对 jQuery.fn 对象的扩展
jQuery.fn.extend({}); window.$ = window.jQuery = jquery; })(window);
jQuery 源码基本框架的更多相关文章
- jQuery源码整体结构(源码2.0.3)
拨开jQuery的面纱,最近了解了下jQuery源码整体框架.主要包括: (1) jQuery 核心模块 (2) sizzle 选择器引擎 (3) Deferred 异步队列 (4) Supp ...
- jQuery源码分析之整体框架
之前只是知道jQuery怎么使用,但是我觉得有必要认真的阅读一下这个库,在分析jQuery源码之前,很有必要对整个jQuery有个整体的框架概念,才能方便后面对jQuery源码的分析和学习,以下是我总 ...
- 三.jQuery源码解析之jQuery的框架图
这张图片是对jQuery源码截图,一点一点拼出来的. 现在根据这张图片来对jQuery框架做一些说明. 一.16~9404行可以发现,最外层是一个自调用函数.当jQuery初始化时,这个自调用函数包含 ...
- 读jQuery源码之整体框架分析
读一个开源框架,大家最想学到的就是设计的思想和实现的技巧.最近读jQuery源码,记下我对大师作品的理解和心得,跟大家分享,权当抛砖引玉. 先附上jQuery的代码结构. (function(){ / ...
- jQuery源码学习感想
还记得去年(2015)九月份的时候,作为一个大四的学生去参加美团霸面,结果被美团技术总监教育了一番,那次问了我很多jQuery源码的知识点,以前虽然喜欢研究框架,但水平还不足够来研究jQuery源码, ...
- jQuery源码:从原理到实战
jQuery源码:从原理到实战 jQuery选择器对象 $(".my-class"); document.querySelectorAll*".my-class" ...
- JQuery源码解析(一)
写在前面:本<JQuery源码解析>系列是基于一些前辈们的文章进行进一步的分析.细化.修改而写出来的,在这边感谢那些慷慨提供科普文档的技术大拿们. 要查阅JQ的源文件请下载开发版的JQ.j ...
- jQuery源码笔记(一):jQuery的整体结构
jQuery 是一个非常优秀的 JS 库,与 Prototype,YUI,Mootools 等众多的 Js 类库相比,它剑走偏锋,从 web 开发的实用角度出发,抛除了其它 Lib 中一些中看但不实用 ...
- jquery 源码解析
静态与实力方法共享设计 遍历方法 $(".a").each() //作为实例方法存在 $.each() //作为静态方法存在 Jquery源码 jQuery.prototype = ...
随机推荐
- U3D物理碰撞总结
OnCollisionEnter的触发条件: 1.都有boxcollider组件并且IsTrigger为false 2.主动碰撞的物体要有非运动学刚体组件,被动碰撞的物体有木有都行 3.如果主动碰撞的 ...
- mac上的键盘生活——输入法键位设置小技巧以及去掉自带输入法
今天上QQ跟阳小进讨论的时候突然聊到了输入法,然后阳小进就发了这样一段文字过来: 修改中西文切换键由Shift到Ctrl 关于为什么要改为Ctrl键,贴吧里有个讨论 在贴吧说服佛振的网友: 「因为 S ...
- MIPI D-PHY 简写收集
Acronyms APPI Abstracted PHY-Protocol InterfaceBER Bit Error Rate 417 CILControl ...
- 线程join
class ThreadB extends Thread { private String ID="0"; private int time=0; pu ...
- STL之deque、queue、stack、list
首先deque和vector是很像的 但是de代表double双向的队列那么deque可以从首部添加(删除)元素也可以从尾部添加(删除)元素. .push_back(elem) .push_front ...
- 层层递进Struts1(七)详解DispatchAction
通过前面几篇博客,不知道大家有没有发现这个问题,虽然现在可以灵活控制跳转了,但是Action的数量还是比较多,如何既能保证跳转灵活,还能减少Action的数量?这就是我们这篇博客所说的Dispatch ...
- poj3624背包问题(一维数组)
Description Bessie has gone to the mall's jewelry store and spies a charm bracelet. Of course, she'd ...
- thinkphp解决表单令牌问题
控制器中添加 C('TOKEN_ON',false); 然后再$this->display();即可
- web项目学习之sitemesh
sitemesh主要有三个主要文件:sitemesh.xml,decorators.xml和做布局用的jsp页面. 一.sitemesh.xml 对于sitemesh.xml这个文件,官方文档上说它不 ...
- 基于XMPP实现的Openfire的配置安装+Android客户端的实现
最近在整理一些这方面的资料,闲话少说,咱还是直奔主题吧 :) 一.基于xmpp实现的openfire的配置安装 1. 下载最新的openfire安装文件 官方下载站点: http://www.igni ...