|
|
false：只克隆當(dāng)前節(jié)點(diǎn)，不克隆任何的子節(jié)點(diǎn)，當(dāng)然也不會克隆他所包裹的文本，因?yàn)槿魏挝谋径加兄赶蛩墓?jié)點(diǎn)（文本節(jié)點(diǎn)）
當(dāng)然有時候兩者是可以通用的哦，如果要復(fù)制的節(jié)點(diǎn)沒有任何的子節(jié)點(diǎn)，這是二者全等；比如 img...
為了讓大家理解的更為深刻，舉個小例子吧：
復(fù)制代碼 代碼如下:
<div>
<span>Shadow</span> |No Shadow
</div>
我定義一個變量用于指向span節(jié)點(diǎn)
var element = document.getElementsByTagName('span')[0];
那么
復(fù)制代碼 代碼如下:
var t1 = element.cloneNode(false).innerHTML;//不復(fù)制子節(jié)點(diǎn)
var t2 = element.cloneNode(true).innerHTML;//copy all
alert(t1);
alert(t2);
這是會依次輸出 （空）“”和Shadow ；
復(fù)制代碼 代碼如下:
var textnode = element.firstChild;//指向文本節(jié)點(diǎn)
var t1 = textnode.cloneNode(false).nodeValue;
var t2 = textnode.cloneNode(true).nodeValue;
alert(t1);
alert(t2);
這是他們會同時輸出Shadow。
【cloneNode的bug】
在上面多級聯(lián)動中說到，會用cloneNode復(fù)制容器，但cloneNode在ie中有一個bug：
在ie用attachEvent給dom元素綁定事件，在cloneNode之后會把事件也復(fù)制過去。
而用addEventListener添加的事件就不會，可以在ie和ff測試下面的代碼：
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
在ie和ff點(diǎn)擊第一個div都會觸發(fā)alert，關(guān)鍵是第二個div，在ff不會觸發(fā)，而ie就會。
當(dāng)然這個是不是bug還不清楚，或許attachEvent本來就是這樣設(shè)計(jì)的也說不定。
但第一版就是由于這個bug，而沒有用cloneNode。
在找解決方法之前，再擴(kuò)展這個問題，看看直接添加onclick事件會不會有同樣的bug。
首先測試在元素里面添加onclick：
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
結(jié)果在ie和ff都會復(fù)制事件。
再測試在js添加onclick：
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
結(jié)果在ie和ff都不會復(fù)制事件，看來只有attachEvent會引起這個bug。
下面是解決方法：
用John Resig在《精通JavaScript》推薦的Dean Edwards寫的addEvent和removeEvent方法來添加/移除事件。
它的好處就不用說了，而且它能在ie解決上面說到的cloneNode的bug。
因?yàn)樗膶?shí)現(xiàn)原理是在ie用onclick來綁定事件，而上面的測試也證明用onclick綁定的事件是不會被cloneNode復(fù)制的。
JavaScript技術(shù)：javascript dom操作之cloneNode文本節(jié)點(diǎn)克隆使用技巧，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。
