jquery 源码结构学习

最近想要了解一下jquery 库是怎样实现的,源码结构如何。通过查看资料知道了,jquery源码整体结构如下所示,平时用到的例如$.ajax()形式的方法主要是通过jq.extend({})中定义的方法属性得到的,形如$("div").css()方法是通过jq.fn.extend({})拓展得到。

(function(window,undefined){
var jq = function(selector,content){
return new jq.fn.init(selector,content,rootjq);
},
jq.fn = jq.prototype = {
init:functin(selector,content,rootjq){};
};
jq.fn.init.prototype = jq.fn;

jq.extend({
// 可供jquery“类”使用的属性和方法,例如$.ajax(),同时可用在jq.fn.extend里面使用的
// 属性和方法
})

jq.fn.extend({
// jq对象具备的方法和属性,例如:$("div").css()
removeDate:function(key) {
return this.each(function(){
jq.removeDate(this,key);
});
}
css:function(name,value) {
// ...
}

});

function fn(){
// 封装的函数,可用于内部使用。
}

if(typeof module==="object" && module && typeof module.exports === "object") {
// 支持模块化的模式
module.exports = jq;
}else {
window.jq = window.$ =jq;
if(typeof define === "function" && define.amd) {
define("jq",[],function(){
return jq;
});
}
}

})(window)

详细信息可参考:https://github.com/chokcoco/jQuery-

https://www.cnblogs.com/xuxiuyu/p/5989743.html

http://bbs.miaov.com/forum.php?mod=viewthread&tid=7385对理解jquery库的整体结构很有帮助。

原文地址:https://www.cnblogs.com/1833lljy/p/9478642.html

时间: 2024-10-26 20:38:12

jquery 源码结构学习的相关文章

jquery源码学习

jQuery 源码学习是对js的能力提升很有帮助的一个方法,废话不说,我们来开始学习啦 我们学习的源码是jquery-2.0.3已经不支持IE6,7,8了,因为可以少学很多hack和兼容的方法. jquery-2.0.3的代码结构如下 首先最外层为一个闭包, 代码执行的最后一句为window.$ = window.jquery = jquery 让闭包中的变量暴露倒全局中. 传参传入window是为了便于压缩 传入undefined是为了undifined被修改,他是window的属性,可以被修

jQuery源码学习2——初始化篇

这一篇主要总结一下jQuery这个js在引入的时候做的一些初始化工作 第一句window.undefined=window.undefined; 是为了兼容低版本的IE而写的 因为在低版本的IE中undefined不是window对象下的属性 因此window.undefined就是undefined 根据=运算符右结核性的特征,=右边的window.undefined就是undefined 既然window没有undefined属性 因此左边其实可以理解为在window下面扩展一个undefi

jquery 源码学习(一)

从上边的注释看,jQuery的源码结构相当清晰.条理,不像代码那般晦涩和让人纠结 1. 总体架构 1.1 自调用匿名函数 self-invoking anonymous function 打开jQuery源码,首先你会看到这样的代码结构: 复制代码 代码如下: (function( window, undefined ) { // jquery code })(window); 1. 这是一个自调用匿名函数.什么东东呢?在第一个括号内,创建一个匿名函数:第二个括号,立即执行 2. 为什么要创建这

jQuery源码学习笔记:构造jQuery对象

3.1源码结构: (function( window, undefined ) { var jQuery = (function() { // 构建jQuery对象 var jQuery = function( selector, context ) { return new jQuery.fn.init( selector, context, rootjQuery ); } // jQuery对象原型 jQuery.fn = jQuery.prototype = { constructor:

jQuery源码学习笔记五 六 七 八 转

jQuery源码学习笔记五 六 七 八 转 Js代码   <p>在正式深入jQuery的核心功能选择器之前,还有一些方法,基本都是数组方法,用于遴选更具体的需求,如获得某个元素的所有祖选元素啦,等等.接着是其缓存机制data.</p> <pre class="brush:javascript;gutter:false;toolbar:false"> //@author  司徒正美|なさみ|cheng http://www.cnblogs.com/ru

jquery源码学习笔记(一)jQuery的无new构建

本人是一名.net程序员..... 你一个.net coder 看什么jQuery 源码啊? 原因吗,很简单.技多不压身吗(麻蛋,前端工作好高...羡慕). 我一直都很喜欢JavaScript,废话不多说了,直接切入正题. 最近看了好几篇jQuery 源码的文章,对于jQuery的无new构建  很是不解. 查了很多资料,总算是搞明白了. jQuery的无new构建 jQuery框架的核心就是从HTML文档中匹配元素并对其执行操作. 回想一下使用 jQuery 的时候,实例化一个 jQuery

jquery 源码学习(三)

jQuery源码分析-03构造jQuery对象-源码结构和核心函数,需要的朋友可以参考下. 作者:nuysoft/高云 QQ:47214707 EMail:[email protected] 毕竟是边读边写,不对的地方请告诉我,多多交流共同进步.本章还未写完,完了会提交PDF. 前记: 想系统的好好写写,但是会先从感兴趣的部分开始. 近期有读者把PDF传到了百度文库上,首先感谢转载和传播,但是据为已有并设置了挺高的财富值才能下载就不好了,以后我整理好了会传到文库上.请体谅一下. 3. 构造jQu

jQuery源码学习感想

还记得去年(2015)九月份的时候,作为一个大四的学生去参加美团霸面,结果被美团技术总监教育了一番,那次问了我很多jQuery源码的知识点,以前虽然喜欢研究框架,但水平还不足够来研究jQuery源码,那时我不明白他们为何要求那么高,现在才知道,原来没那么高,他问的都是jQuery最基本的框架架构,不过对于不知道的来说,再简单我也是不知道,那时写了一篇博文去吐槽了一下,那时候也是我自己真正激发自己的时候,那时候我说我一定要搞好自己的jQuery基础,没想到那么快就实现了,一个月的源码学习时间就结束

jquery 源码学习(四)构造jQuery对象-工具函数

jQuery源码分析-03构造jQuery对象-工具函数,需要的朋友可以参考下. 作者:nuysoft/高云 QQ:47214707 EMail:[email protected] 声明:本文为原创文章,如需转载,请注明来源并保留原文链接. 读读写写,不对的地方请告诉我,多多交流共同进步,本章的的PDF等本章写完了发布. jQuery源码分析系列的目录请查看 http://nuysoft.iteye.com/blog/1177451,想系统的好好写写,目前还是从我感兴趣的部分开始,如果大家有对哪