-
常見的棧與隊列操作：push、pop、shift、unshift、求和、each、排序及篩選等。 快速找到集合中對應的目標元素：.get()、:index()、 :lt()、:gt()、:even()及 :odd()。它們會過濾它們前面的匹配表達式的集合元素，篩選的依據就是這個元素在原先匹配集合中的順序。查看全部
-
end()方法主要用于JQ的鏈式屬性中。當沒有使用鏈式時，我們通常只是調用變量名上的前一個對象，所以不需要操作棧。 end()源碼： end: function() { return this.prevObject || this.constructor(null); } prevObject在構建jQuery對象的時候，通過pushStack方法構建。查看全部
-
JQ內部維護著一個JQ對象棧，每個遍歷方法都會找到一組新元素（一個JQ對象），然后JQ會把這組元素推入到棧中。 每個JQ對象都有3個屬性：context、selector和prevObject。其中prevObject指向這個對象棧中的前一個對象，通過這個屬性可以回溯到最初的DOM元素集中。比如：$("ul").find("li")返回li集合，prevObject則指向$("ul")。 回溯方法： .end()結束當前篩選操作，回到前一個JQ對象。 .addBack()（又名andSelf）把堆棧中之前的元素集添加到當前集合。查看全部
-
插件接口：$.extend(target, [object1], ..., [objectN]) jQuery.extend = jQuery.fn.extend = function(){...}; jQuery.extend的this指向jQuery對象，jQuery.fn.extend的this指向fn對象（即JQ原型對象）。 插件開發有兩種：1、掛在JQ命名空間下的全局函數（靜態方法）；2、掛在JQ原型下的方法（實例方法）。 插件接口把擴展的功能從主體框架中剝離出去，降低了框架的復雜度，實現了獨立功能與框架的松耦合。查看全部
-
鏈式調用其實就是一種Internal DSL。 JQ通過簡單擴展原型方法并通過“return this”的形式來實現跨瀏覽器的鏈式調用；利用JS下的簡單工廠方法模式，為所有對于同一個DOM對象的操作指定同一個實例。 優點： 1、節約了JS代碼； 2、返回的都是同一個對象，可以提高代碼的效率。 實現鏈式的基本條件：實例對象先創建好，調用自己的方法。查看全部
-
分離構造器后，通過init.prototype = jQuery.fn把jQuery.prototype的引用賦給jQuery.fn.init.prototype，從而把init和jQuery構造器的原型給關聯起來。 分離構造器實現了靜態與實例方法的共享，實例方法（init的原型鏈方法）取于靜態方法，靜態方法掛在jQuery構造器上。查看全部
-
構建對象的步驟：創建一個新對象 -> 將構造函數的作用域賦給新對象（所以this指向新對象） -> 執行構造函數中的代碼 -> 返回這個新對象。 JQ把原型上的一個init方法作為構造器，避免了死循環問題： var jq = function(selector) { return new jq.fn.init(selector); } 通過new把init方法和jq方法分離成2個獨立的構造器，此時jq的this就和原型鏈關聯起來了。查看全部
-
JQ采用原型式結構，節省性能。查看全部
-
沖突情況： 1、JQ采用$作為命名空間，可能與別的庫或插件沖突。 2、JQ版本更新太快，插件跟不上，導致不同版本對插件的支持度不一樣。 解決方案：使用noConflict函數，將變量的控制權讓給第一個實現它的那個庫。 該函數必須在導入JQ后、導入另一個沖突庫前使用。 運行該函數后，就只能使用JQ變量訪問JQ對象，比如$("#id")要換成jQuery("#id")。 代碼： var _jQuery = window.jQuery, _$ = window.$; jQuery.noConflict = function( deep ) { if ( window.$ === jQuery ) { window.$ = _$; } if ( deep && window.jQuery === jQuery ) { window.jQuery = _jQuery; } return jQuery; };查看全部
-
DOM文檔加載順序：解析HTML結構 -> 加載外部JS和CSS文件 -> 解析并執行JS代碼 -> 構造HTML DOM模型（ready） -> 加載圖片等外部文件 -> 頁面加載完畢（load）。 ready構建了基本的DOM結構，越快加載越好，因此ready比load先執行。 JQ的兼容策略： 針對高級的瀏覽器，使用DOMContentLoaded事件。 對于低版本IE瀏覽器，如果瀏覽器存在document.onreadystatechange事件，且該事件觸發時document.readyState=='complete'，則視為DOM樹已載入；在非irame內時，不斷地通過能否執行doScroll方法判斷DOM是否加載完畢，doScroll未產生異常就表示加載完畢；通過查看readyState的狀態來確定頁面的加載是否完成了，保證執行的正確。查看全部
-
jQuery內部采用了一種叫“類數組對象”的方式作為存儲結構，所以我們既可以像對象一樣處理jQuery操作，也能像數組一樣使用push、pop、shift、unshift、sort、each、map等類數組的方法操作jQuery對象。 jQuery的入口都是統一的$, 通過傳遞參數的不同，實現了9種方法的重載： 1. jQuery([selector,[context]]) 2. jQuery(element) 3. jQuery(elementArray) 4. jQuery(object) 5. jQuery(jQuery object) 6. jQuery(html,[ownerDocument]) 7. jQuery(html,[attributes]) 8. jQuery() 9. jQuery(callback) jQuery的無new構建原理：函數內部首先保證通過new操作符構建，這樣就能保證當前構建的是一個帶有this的實例對象，然后就可以把所有的屬性與方法作為對象的key與value的方式給映射到this上。 同時，jQuery在結構上做了很多優化，不僅實現類數組結構、方法的原型共享，還實現方法的靜態與實例的共存。查看全部
-
JQ利用JS函數作用域的特性，采用IIFE包裹自身的方法來解決命名空間與變量污染的問題。 JQ的IIFE寫法： 1、(function(window, factory) { factory(window) }(this, function() { return function() { //jQuery的調用 } })) 2、var factory = function(){ return function(){ //執行方法 } } var jQuery = factory(); 3、(function(window, undefined) { var jQuery = function() {} // ... window.jQuery = window.$ = jQuery; })(window);查看全部
-
JQ2.1版本分為五大塊：選擇器、DOM操作、事件、AJAX、動畫。 共13個模塊：核心方法、回調函數、異步隊列、數據緩存、隊列操作、選擇器引、屬性操作、節點遍歷、文檔處理、樣式操作、屬性操作、事件體系、AJAX交互、動畫引擎。查看全部
-
JQ定義：一個輕量的JS庫，兼容CSS3和各個瀏覽器，使用戶方便地處理HTML、事件、效果和AJAX交互等。JQ2.0+不再支持IE8-。 JQ核心理念：簡潔的API，優雅的鏈式，強大的查詢，便捷的操作。 前端開發的基礎核心：瀏覽器兼容，屬性獲取，邏輯流程，性能，……。查看全部
-
任何庫與框架設計的第一個要點就是解決命名空間與變量污染的問題。 jQuery就是利用了JavaScript函數作用域的特性，采用立即調用表達式包裹了自身的方法來解決這個問題。 寫法3： (function(window, undefined) { var jQuery = function() {} // ... window.jQuery = window.$ = jQuery; })(window); 從上面的代碼可看出，自動初始化這個函數，讓其只構建一次。詳細說一下這種寫法的優勢： 1、window和undefined都是為了減少變量查找所經過的scope作用域。當window通過傳遞給閉包內部之后，在閉包內部使用它的時候，可以把它當成一個局部變量，顯然比原先在window scope下查找的時候要快一些。 2、undefined也是同樣的道理，其實這個undefined并不是JavaScript數據類型的undefined，而是一個普普通通的變量名。只是因為沒給它傳遞值，它的值就是undefined，undefined并不是JavaScript的保留字。查看全部
舉報
0/150
提交
取消