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