前言：

看 jQuery 源碼的一個痛點就是調用一個函數時，里面會調用 N 個其他函數，然后這 N 個函數里面又會調用 M 個其他其他函數。。

本篇文章主要是對detach()/empty()/remove()/unwrap()]() 中兩個函數 getAll和cleanData() 進行解析。

一、getAll(context, tag)

作用：

用來獲取 context 上的 tag 標簽，或者是將 context 和 context 里的 tag 標簽的元素合并

源碼：

//一般是傳的node,'script' //應該是用來獲取context上的tag標簽，或者是將context和context里的tag標簽的元素合并 //源碼4893行 function getAll( context, tag ) {  // Support: IE <=9 - 11 only  // Use typeof to avoid zero-argument method invocation on host objects (#15151)  var ret;  console.log(context,typeof context.getElementsByTagName,typeof context.querySelectorAll,'context4894')  //如果context存在getElementsByTagName的方法的話  if ( typeof context.getElementsByTagName !== "undefined" ) {   //tag:script   //從context中獲取script標簽的節點   ret = context.getElementsByTagName( tag || "*" )   console.log(tag,ret,'ret4897')  } //DocumentFragment沒有getElementsByTagName方法，但有querySelectorAll方法 else if ( typeof context.querySelectorAll !== "undefined" ) {   ret = context.querySelectorAll( tag || "*" );  } else {   ret = [];  }  console.log(nodeName( context, tag ),'nodeName4909')  //nodeName() 判斷兩個參數的nodename是否相等  if ( tag === undefined || tag && nodeName( context, tag ) ) {   return jQuery.merge( [ context ], ret );  }  return ret; }

注意：DocumentFragment 沒有getElementsByTagName方法，但有querySelectorAll方法！

二、$.merge()

作用：

合并兩個數組內容到第一個數組

源碼：

 // Support: Android <=4.0 only, PhantomJS 1 only  // push.apply(_, arraylike) throws on ancient WebKit  //源碼461行  //將second合并到first后面  merge: function( first, second ) {   var len = +second.length,    j = 0,    i = first.length;   //依次將second的item添加到first后面   for ( ; j < len; j++ ) {    first[ i++ ] = second[ j ];   }   //first可能是類數組，所以需要更新下length屬性   first.length = i;   return first;  },

需要注意的是最后的 first.length = i

三、cleanData()

作用：

清除元素節點上的事件和數據

源碼：

 //清除elems上的數據和事件  //源碼6146行  cleanData: function( elems ) {   var data, elem, type,    //beforeunload/blur/click/focus/focusin/focusout/    //load/mouseenter/mouseleave/pointerenter/pointerleave    special = jQuery.event.special,    i = 0;   for ( ; ( elem = elems[ i ] ) !== undefined; i++ ) {    //允許的節點類型    if ( acceptData( elem ) ) {     //當有事件綁定到elem后，jQuery會給elem一個屬性dataPriv.expando     //該屬性上面就綁定了事件和數據     if ( ( data = elem[ dataPriv.expando ] ) ) {      //如果data上有事件的話      if ( data.events ) {       //逐個列舉data上的事件，比如click       for ( type in data.events ) {        // 如果special中有data.events上的事件        if ( special[ type ] ) {         //調用jQuery.event.remove方法，移除elem上的event類型         jQuery.event.remove( elem, type );         // This is a shortcut to avoid jQuery.event.remove's overhead        }        //應該是自定義的事件        else {         //本質即elem.removeEventListener(type,handle)         jQuery.removeEvent( elem, type, data.handle );        }       }      }      // Support: Chrome <=35 - 45+      // Assign undefined instead of using delete, see Data#remove      //最后將元素的dataPriv.expando屬性置為undefined      elem[ dataPriv.expando ] = undefined;     }     //dataUser應該是用戶綁定的事件     if ( elem[ dataUser.expando ] ) {      // 將元素的dataUser.expando屬性置為undefined      // Support: Chrome <=35 - 45+      // Assign undefined instead of using delete, see Data#remove      elem[ dataUser.expando ] = undefined;     }    }   }  }