jQuery的buildFragment函數，主要是將傳入的HTML代碼用document.createDocumentFragment轉變成文檔碎片，具體細節如下圖：

圖片來源于jQuery技術內幕：

jQuery.buildFragment = function( args, nodes, scripts ) {
//args：準備轉換為DOM結構的THML代碼
//nodes：數組，含有DOM元素或者jquery對象，用于修正創建文檔片段DocumentFragment文檔對象
//scripts：存放HTML代碼的script元素
var fragment, cacheable, cacheresults, doc,
first = args[ 0 ];

if ( nodes && nodes[0] ) {doc = nodes[0].ownerDocument || nodes[0];//ownerDocument取節點所在的整個DOM樹//修正nodes里面的參數 }if ( !doc.createDocumentFragment ) {doc = document;//如果不存在createDocumentFragment則用DOM1的方法 }if ( args.length === 1 && typeof first === "string" && first.length < 512 && doc === document &&first.charAt(0) === "<" && !rnocache.test( first ) &&(jQuery.support.checkClone || !rchecked.test( first )) &&(jQuery.support.html5Clone || !rnoshimcache.test( first )) ) {// rnocache = /<(?:script|object|embed|option|style)/i,// rchecked = /checked\s*(?:[^=]|=\s*.checked.)/i,// rnoshimcache = new RegExp("<(?:" + nodeNames + ")", "i"),// 判斷是否符合緩存// 1、 args.length === 1 ： args長度大于1，且第一個元素是字符串// 2、 first.length < 512 ： 長度小于512字節，太大就不緩存了// 3、 doc === document ： doc是當前文檔對象，不緩存其他框架(iframe)// 4、 first.charAt(0) === "<" ： HTML代碼以左尖括號開頭，即只緩存DOM元素，不緩存文本節點// 5、不能含有<script>、<object>、<embed>、<option>、<style>// 6、jQuery.support.html5Clone || !rnoshimcache.test( first ) ， 可以復制HTML5元素或者HTML代碼中不含有HTML標簽cacheable = true;// 在使用轉換后的DOM元素時，如果cacheable為true，則必須先復制一份再使用，否則可以直接使用cacheresults = jQuery.fragments[ first ];//嘗試從緩存讀數據if ( cacheresults && cacheresults !== 1 ) {fragment = cacheresults;} }if ( !fragment ) {fragment = doc.createDocumentFragment();jQuery.clean( args, doc, fragment, scripts );// jQuery.clean可以將HTML代碼轉換為DOM節點 }if ( cacheable ) {jQuery.fragments[ first ] = cacheresults ? fragment : 1;// 如果符合緩存，則把轉換后的DOM元素放入緩存對象jQuery.fragments中 }return { fragment: fragment, cacheable: cacheable };

};

總結

以上是生活随笔為你收集整理的jQuery源码阅读3— bulidFragment( )的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。