`
bevis.cn
  • 浏览: 154603 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

jQuery源码学习一

阅读更多
今天下载了目前最新版的jQuery,jquery-1.3.2.js,开始学习jQuery的源码
因为jQuery与ExtJS有很大的不同,ExtJS比较庞大,比如类分得比较清楚,动态方法、静态方法、属性等只要一看api都能很清楚。ExtJS那样做是因为他是一个比较大的框架,而jQuery却只是一个工具库,小巧和灵活是它的特点,所以在jQuery里我们会看到有很多用法,我们平时根本没有那么用过。

1.当download jquery-1.3.2.js后,打开源代码,会发现整个jquery的一个结构是
(function(){
  .....//代码省略
})();

这中间省略部分就是jQuery的主要代码实现部分。刚开始一看还有些看不明白,后来慢慢研究才发现,第一个括号里其实是一个js函数,
平时写函数都是:
//正常的函数写法
function functionName(){
  .....
}
//函数调用
functionName();

而jQuery里第一个括号里那个函数只是省略了函数名,在这里就暂时称为匿名函数吧,用括号括起来,只是为了调高优先级来处理。
也就是说你把"(function (){})"换成一个函数名jqueryFun,再看看,此时就成了
jqueryFun();
这不就是调用了jqueryFun这个函数吗!
这样看来,当我们把jquery导入到我们网页里的时候,只要jqurey的代码加载进来就立即执行了jQuery的功能。
(function(){
var 
	window = this,
	undefined,
	_jQuery = window.jQuery,
	_$ = window.$,
	jQuery = window.jQuery = window.$ = function( selector, context ) {
		return new jQuery.fn.init( selector, context );
	},
        quickExpr = /^[^<]*(<(.|\s)+>)[^>]*$|^#([\w-]+)$/,
	isSimple = /^.[^:#\[\.,]*$/;

})();


上面几行代码主要是对jQuery初始化前的一些调定,为了加速jQuery执行,
比如jQuery = window.jQuery = window.$,把jQuery,$等价起来,后面就可以用$符号了。
这样把jQuery注册为window的一个属性,这样使用jQuery和$就像使用window下面的其它属性一样,比如documnt等。

然后return new jQuery.fn.init( selector, context );进行jQuery相关设定的初始化操作!

quickExpr 和isSimple 是两个正则表达式,quickExpr 是检验html标签,isSimple 是检验selector
根据jQuery的作者解释是:
// A simple way to check for HTML strings or ID strings
// (both of which we optimize for)
quickExpr = /^[^<]*(<(.|\s)+>)[^>]*$|^#([\w-]+)$/,
// Is it a simple selector
isSimple = /^.[^:#\[\.,]*$/; 





4
0
分享到:
评论

相关推荐

    Jquery源码分析 源码

    通过对jQuery源码的深度剖析,我们可以学习到JavaScript设计模式、DOM操作的最佳实践、事件处理的优化策略,以及Ajax的封装技术,这些都将对我们的前端开发工作大有裨益。同时,理解源码也能帮助我们更好地利用...

    jQuery源码分析系列.pdf

    - **前言开光**:介绍分析jQuery源码的目的和价值,强调通过深入研究源码,可以学习到先进的设计理念和实践技巧。 - **总体架构**:解析jQuery的模块化设计,包括各个功能模块之间的关系和交互方式,帮助理解jQuery...

    Head First jquery源码

    《Head First jQuery源码》是一本深入解析jQuery库的书籍,其内容主要涵盖了jQuery的核心功能、设计理念以及实现机制。jQuery是JavaScript的一个库,它极大地简化了网页中的DOM操作、事件处理、动画效果以及Ajax交互...

    jQuery源码+中文详细注解

    这部分使用了一个立即执行的匿名函数来包裹整个jQuery源码,这样做的目的是形成一个闭包,保护内部的变量不被外部干扰,同时也避免了命名冲突的问题。 ##### 4. 关键字保护 ```javascript var _jQuery = window....

    Head First jQuery源码

    《Head First jQuery》是一本非常受欢迎的前端开发书籍,它以直观、易懂的方式介绍了jQuery库的使用和原理。源码通常包含书中示例代码...通过源码学习,不仅能提高对jQuery的理解,还能培养解决问题和调试代码的能力。

    jquery源码框架解读

    《jQuery源码框架解读...通过对jQuery源码的深入学习,开发者不仅能掌握其工作原理,还能学习到面向对象编程、函数式编程、设计模式等多方面的知识。这将对提升开发效率、编写高性能代码以及构建复杂Web应用大有裨益。

    通过jQuery源码学习javascript(二)

    "1.8.3", init: function() { return this; }, test: function() { console.log('test');...同时,这也展示了JavaScript中`this`的灵活用法和原型继承的概念,这些都是深入理解JavaScript和jQuery源码的关键。

    jquery api, jquery ui api, jquery源码分析

    深入理解jQuery源码有助于开发者更好地利用其API并优化性能。主要关注点包括: 1. **选择器引擎(Sizzle)**:jQuery 使用Sizzle作为其选择器引擎,它是如何快速高效地解析CSS选择器并找到匹配元素的。 2. **链式...

    jquery 源码分析

    首先,我们来看看`jquery-1.11.1.js`,这是未压缩的jQuery源码,适合学习和理解。jQuery的核心在于它的选择器引擎(Sizzle)、DOM操作、事件处理和动画系统。在源码中,可以看到jQuery构造函数`jQuery`接收一个参数...

    jQuery源码解读

    jQuery 源码解读 jQuery 是一款非常流行的 JavaScript 库,以其简洁...通过学习源码,你可以了解到如何高效地操作 DOM,如何优雅地处理事件,以及如何编写高性能的 JavaScript 代码。这将极大地提升你的前端开发能力。

    jquery源码

    **jQuery源码详解** jQuery,一个轻量级、高...通过深入学习jQuery源码,我们可以理解其背后的实现机制,进一步优化我们的代码,提升开发效率。jQuery的源码充满了高效的设计和编程技巧,值得每一个前端开发者去探究。

    锋利的Jquery 源码 锋利的Jquery 源码 jQuery学习资料

    《锋利的jQuery》是一本深受开发者欢迎的jQuery学习书籍,其源码是理解jQuery核心原理的重要参考资料。jQuery是一款高效、简洁的JavaScript库,它极大地简化了JavaScript在网页上的DOM操作、事件处理、动画设计和...

    jquery 源码初探,一步步实现自己的jquery(四)

    在本篇《jquery 源码初探,一步步实现自己的jquery(四)》中,...每一步都需要仔细研究jQuery源码,理解其背后的逻辑,并尝试用更简洁的方式实现。这样,即使无法完全复制jQuery的所有特性,也能收获宝贵的实践经验。

    jQuery 源码+实例+注释

    1. **选择器**: jQuery 的核心功能之一是其强大的选择器,允许开发者以 CSS 语法选择页面中的元素。例如,`$("#id")` 选择 ID 为 id 的元素,`$(".class")` 选择所有 class 类名为 class 的元素。 2. **DOM 操作**:...

    jquery各种版本源码

    描述中提到,“肯定有一个是你需要的”,这句话道出了jQuery源码学习的价值。无论你是初学者,希望通过阅读源码了解基础的DOM操作和事件处理,还是经验丰富的开发者,想要深入理解其内部机制,如选择器引擎Sizzle、...

    jQuery源码详细分析中文注释

    总的来说,这份《jQuery源码详细分析中文注释》是学习和研究jQuery源码的绝佳资料,通过深入阅读和理解注释,开发者不仅可以掌握jQuery的工作原理,还能提升JavaScript编程技巧,为自己的项目开发带来更高的效率和更...

    jQuery源码

    《jQuery源码解析》 jQuery,作为一款广泛应用于前端开发的JavaScript库,因其简洁的API和强大的功能,深受开发者喜爱。本文将深入探讨jQuery 1.12版本的源码,帮助读者理解其核心机制,提升JavaScript技术能力。 ...

    锋利的jQuery 源码

    《锋利的jQuery源码》是一本...通过对《锋利的jQuery源码》的深入学习,开发者不仅可以提升JavaScript编程技能,还能了解到软件设计模式、性能优化等多方面的知识,从而在实际项目中更好地运用jQuery,提高开发效率。

    jquery源码好不容易找到的与大家分享

    总结,jQuery源码的深度探索是一次宝贵的编程之旅,它让我们看到了一个优秀JavaScript库的设计思想和实现技巧。无论你是初学者还是经验丰富的开发者,深入理解jQuery,都将对你的职业生涯产生深远影响。

Global site tag (gtag.js) - Google Analytics