资源描述：
《jquery-191源码分析系列（十一）dom操作续之克隆节点_jquery》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。
1、jQuery-1.9.1源码分析系列(H—)DOM操作续之克隆节点什么情况下使用到克隆节点？我们知道在对DOM操作过程中如果直接使用节点会出现节点随操作而变动的情况。比如对节点使用.after/,before/,append等方法后，节点被添加到新的地方，原来的位置上的节点被移除了。有的时候需要保留原来位置上的节点，仅仅是需要一个副木添加到对应位置，这个吋候克隆就有了使用场景。jQuery.fn.clone克隆当前匹配元索集合的一个副本，并以jQuery对象的形式返回。你还可以指定是否复制这些匹配元索(甚至它们的子元索
2、)的附加数据(data()函数)和绑定事件。jQueyr.fn.clone:function(withDataAndEvents,deepDataAndEvents)参数描述3•克隆函数的底层实现步骤分解如b*(jQuery.clone)第一步，先克隆岀DOM节点。对支持正确的节点克隆(即支持elem.cloneNode并保证克隆无误)的DOM节点直接使用cloneNode(true),否则口建一个节点来保存被克隆数据然后获取该节点。if(jQucry.support・html5Clonc
3、
4、jQucry.isXMLD
5、oc(clem)I!rnoshimcache・test(V+elem・nodeName+)){clone=elem.cloneNode(true);//IE〈二8不能正确克隆已分离、未知的节点//直接新建一个相同的节点，然后获取}else{//fragmentDiv是全局变量fragmentDiv.innerHTML=elem.outerHTML;fragmentDiv.removeChiId(clone二fragmentDiv.firstCh订d);}第二步，如果是IE浏览器下,则需要通过fixCloneNodels
6、sues(node,destElements[i]);来逐个修正IE克隆问题。1E克隆解决方案全部包含在了fixCloneNodelssues中，下一节详细分析。里面的jQuery.support内容点击这里查看更多〃针对ie克隆问题修正if((!jQuery.support.noCloneEvent
7、
8、!jQuery.support.noCloneChecked)&&(elem.nodeType二二二1
9、
10、elem.nodeType二二二11)&&[jQuery.isXMLDoc(clem)){〃在这里我们不使用Si
11、zzle的原因是：http://jsperf.com/getall-vs-sizzle/2destElements=getAll(clone);srcElements二getAll(elem);〃修正所有IE克隆问题for(i=0;(node二srcElcmcnts[i])!=null;++i){//Ensurethatthedestinationnodeisnotnull;Fixes#9587if(destElements[i]){fixCloneNodelssues(node,destElements[i]);第三
12、步,如果要克隆缓存数据（包括普通数据和绑定事件），克隆〃克隆绑定的事件if(dataAndEvents){if(deepDataAndEvents){srcElements=srcElements
13、
14、getAll(elem);destElements二destElements
15、
16、getAll(clone);for(i二0;(node二srcElements[i])!二nul1;i++){cloncCopyEvcnt(node,dcstElcmcnts[i]);}}else{cioneCopyEvent(elem,clo
17、ne);}}备注：cloneCopyEvent函数屮会将原节点的数据保存到克隆节点屮，然后将原节点的事件绑定到新的克隆节点上functioncioneCopyEvent(sre,dest){if(dest・nodeType!==1
18、
19、!jQuery.hasData(sre)){return;}vartype,i,1,oldData=jQuery._data(sre),curData=jQuery.data(dost,oldData),//dost是克隆对的节点events=oldData.events;if(event
20、s){〃保证被克隆的节点的事件对象干净，确保没有后面添加的事件没有重复deletecurData.handle;curData・events={};for(typeinevents){for(i=0,1=events[type]・1ength;i<1;i++){jQuery.event,add(dest,type,events[t
