1. 程式人生 > >jQuery深入之原始碼解析(一)

jQuery深入之原始碼解析(一)

總體架構

這裡寫圖片描述
這裡寫圖片描述
可以看出來jQuery主要有三個模組:
入口模組、功能模組、底層支援模組。
- 入口模組
在構造jQuery物件模組中,如果在呼叫建構函式建立jQuery物件時,會呼叫選擇器sizzle遍歷文件,查詢匹配的Dom,並建立一個包含這些Dom元素的jquery物件。
-底層模組 工具方法utilities
用於簡化對jquery物件、Dom元素、陣列、物件、字串等的操作

這是壓縮版的
這裡寫圖片描述
v2.2.4版本
這裡寫圖片描述

(function(global, factory) {
    factory(global);
}(typeof window !== "undefined"
? window : this, function(window, noGlobal) { var jQuery = function( selector, context ) { return new jQuery.fn.init( selector, context ); }; jQuery.fn = jQuery.prototype = {}; // 核心方法 // 回撥系統 // 非同步佇列 // 資料快取 // 佇列操作 // 選擇器引 // 屬性操作 // 節點遍歷 // 文件處理 // 樣式操作 // 屬性操作
// 事件體系 // AJAX互動 // 動畫引擎 return jQuery; }));

本文是在閱讀《jQuery技術內幕》後寫的,以及慕課網上的jQuery原始碼解析,也結合了網上的其他對jQuery的分析。

閱讀好的原始碼有利於對好的程式碼風格進行學習,由於水平有限,這些都是我的學習心得體會。