一、jQuery.clean使用方法
jQuery.clean( elems, context, fragment, scripts );
二、思路分析
1、處理參數context,確保其為文檔根節點document
2、處理參數elems數組(循環遍歷數組)
2.1、elem為數字,轉換為字符串
2.2、elem為非法值,跳出本次循環
2.3、elem為字符串
2.4、字符串不存在實體編號或html標簽,則創建文本節點
2.5、字符串為實體編號或html標簽
代碼如下:
創建一個div元素并插入到文檔碎片中
處理xhtml風格標簽
將elem包裹起來,并將包裹后的字符串作為div的innerHTML
如果包裹深度大于1,只留下第一層包裹元素
清除在ie6,7中空table標簽自動加入的tbody
將在ie9以下瀏覽器中剔除的開頭空白字符串作為div元素的第一個文本子節點
將elem重新賦值為div的子節點集合(nodeList對象),
移除本次循環中文檔碎片中的div,保持下一次循環中干凈的div元素
2.3、如果elem為文本節點,則直接添加到要返回的ret數組中,否則將elem(nodeList對象)中的節點合并到數組
2.4、修復在ie6、7中type為radio,checkbox類型的節點的選中狀態(checked)失效的bug
3、處理參數fragment
3.1、將ret中各節點添加到文檔碎片fragment中
3.2、提取節點中的script子節點,并將其添加到ret數組中,添加的script位置為其原父元素位置后面
4、返回ret數組
三、源碼注釋分析
1、函數中用到的變量及函數
代碼如下:
var nodeNames = "abbr|article|aside|audio|bdi|canvas|data|datalist|details|figcaption|figure|footer|" +
"header|hgroup|mark|meter|nav|output|progress|section|summary|time|video",
wrapMap = {
option: [ 1, "<select multiple='multiple'>", "</select>" ],
legend: [ 1, "<fieldset>", "</fieldset>" ],
thead: [ 1, "<table>", "</table>" ],
tr: [ 2, "<table><tbody>", "</tbody></table>" ],
td: [ 3, "<table><tbody><tr>", "</tr></tbody></table>" ],
col: [ 2, "<table><tbody></tbody><colgroup>", "</colgroup></table>" ],
area: [ 1, "<map>", "</map>" ],
_default: [ 0, "", "" ]
},
rxhtmlTag = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([/w:]+)[^>]*)//>/gi,
rtagName = /<([/w:]+)/,
新聞熱點
疑難解答
圖片精選