jQuery技术内幕电子版4
參數selector是復雜HTML代碼
則利用瀏覽器的innerHTML機制創建DOM元素
第157行:如果HTML代碼滿足緩存條件,則在使用轉換后的DOM元素時,必須先復制一份再使用,否則可以直接使用
第160行:將新創建的DOM元素數組合并到當前jQuery對象中并返回
參數selector是“#id”,且未指定參數context
則調用document.getElementById()查找含有指定id屬性的DOM元素
第169~173行:如果所找到元素的屬性id值與傳入的值不相等,則調用Sizzle查找并返回一個含有選中元素的新jQuery對象。
參數selector是選擇器表達式
如果沒有指定上下文,則執行rootjQuery.find(selector);如果指定了上下文,且上下文是jQuery對象,則執行context.find(selector);如果指定了上下文,但上下文不是jQuery對象,則執行this.constructor(context).find(selector)
參數selector是函數
第197~199行:如果參數selector是函數,則認為是綁定ready事件。從第198行代碼可以看出$(function)是$(document).ready(function)的簡寫
參數selector是jQuery對象
則認為它是jQuery對象,將會復制它的屬性selector和context。
參數selector是任意其他值
如果selector是數組或偽數組(如jQuery對象),則都添加到當前jQuery對象中;如果selector是JavaScript對象,則作為第一個元素放入當前jQuery對象中;如果是其他類型的值,則作為第一個元素放入當前jQuery對象中。最后返回當前jQuery對象。
2.4 jQuery.buildFragment(args, nodes, scripts)
2.4.1 實現原理
方法jQuery.buildFragment(args, nodes, scripts)先創建一個文檔片段DocumentFragment,然后調用方法jQuery.clean(el-ems, context, fragment, scripts)將HTML代碼轉換為DOM元素,并存儲在創建的文檔片段中。
此外,如果HTML代碼符合緩存條件,方法jQuery.build-Fragment()還會把轉換后的DOM元素緩存起來,下次(實際上是第三次)轉換相同的HTML代碼時直接從緩存中讀取,不需要重復轉換
2.4.2 源碼分析
5個步驟:
1)如果HTML代碼符合緩存條件,則嘗試從緩存對象jQuery.fragments中讀取緩存的DOM元素。2)創建文檔片段DocumentFragment。3)調用方法jQuery.clean(elems, context, fragment, scripts)將HTML代碼轉換為DOM元素,并存儲在創建的文檔片段中。4)如果HTML代碼符合緩存條件,則把轉換后的DOM元素放入緩存對象jQuery.fragments。5)最后返回文檔片段和緩存狀態{fragment: fragment,cacheable: cacheable}
第6085行:定義方法jQuery.buildFragment(args, nodes,scripts),它接受3個參數:
參數args:數組,含有待轉換為DOM元素的HTML代碼
參數nodes:數組,含有文檔對象、jQuery對象或DOM元素
參數scripts:數組,用于存放HTML代碼中的script元素
先嘗試讀取nodes[0]的屬性ownerDocument并賦值給doc,ownerDocument表示DOM元素所在的文檔對象。如果nodes[0].ownerDocument不存在,則假定nodes[0]為文檔對象并賦值給doc,但doc可能不是文檔對象,,此時需要檢查doc.createDocumentFragment是否存在,如果不存在則修正doc為當前文檔對象document
嘗試從緩存對象jQuery.fragments中讀取緩存的DOM元素
滿足以下所有條件,才認為符合緩存條件
??數組args的長度為1,且第一個元素是字符串,即數組args中只含有一段HTML代碼
??HTML代碼的長度小于512(1/2KB),否則可能會導致緩存占用的內存過大。
??文檔對象doc是當前文檔對象,即只緩存為當前文檔創建的DOM元素,不緩存其他框架(iframe)的
??HTML代碼以左尖括號開頭,即只緩存DOM元素,不緩存文本節點
??HTML代碼中不能含有以下標簽:<script>、<object>、<embed>、<option>、<style>
??當前瀏覽器可以正確地復制單選按鈕和復選框的選中狀態checked,或者HTML代碼中的單選按鈕和復選按鈕沒有被選中
??當前瀏覽器可以正確地復制HTML5元素,或者HTML代碼中不含有HTML5標簽
如果HTML代碼滿足緩存條件,則設置變量cacheable為true
第6115~6118行:嘗試從緩存對象jQuery.fragments中讀取緩存的DOM元素。如果緩存命中,并且緩存值不是1,則表示讀取到的是文檔片段,賦值給變量fragment,文檔片段中包含了緩存的DOM元素
轉載于:https://www.cnblogs.com/sdgjytu/p/3931652.html
總結
以上是生活随笔為你收集整理的jQuery技术内幕电子版4的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Javascript数字前补零的功能
- 下一篇: ECMAScript5 ES5