由于DOM中的綁定和移除的方法名為appendChild和removeChild,所以使用jQuery時也會聯(lián)想到append和remove。但實際上在jQuery中append對應(yīng)的是detach而不是remove。jQuery的remove是一個很兇殘的方法,它會把對象上綁定的事件都移除掉。
可以執(zhí)行這樣的代碼試試
$(function(){
var div=$("<div/>").click(function(e){
console.log(e);
}).text("次碳酸鈷");
//劫持DOM上的removeEventListener
div[0].removeEventListener=function(){
console.log("?。??我怎么被移除了。。");
};
//調(diào)用remove后再放入body中,click將永遠都不會觸發(fā)
div.remove().appendTo(document.body);
});
這里我就不截圖了,劫持的removeEventListener方法會被調(diào)用到。上面的代碼運行后div點擊事件是無效的,因為jQuery中的事件列表已經(jīng)因為remove的調(diào)用而清空了。所以不要輕易使用remove方法!另外,empty和html這些方法也都會調(diào)用remove,所以也要慎用!
$(function(){
var div=$("<div/>").click(function(e){
console.log(e);
}).text("次碳酸鈷").appendTo(document.body);
//劫持DOM上的removeEventListener
div[0].removeEventListener=function(){
console.log("?。。课以趺幢灰瞥恕?。");
};
//清空html,上面的劫持方法依然會被調(diào)用
$(document.body).html("");
//$(document.body).empty(); //使用empty也和html("")一樣
});
如果只需要移除DOM而保留事件應(yīng)該使用detach,例如
$(function(){
var div=$("<div/>").click(function(e){
console.log(e);
}).text("次碳酸鈷").appendTo(document.body);
//劫持DOM上的removeEventListener
div[0].removeEventListener=function(){
console.log("?。。课以趺幢灰瞥恕?。");
};
//這樣才不會移除事件,click事件可以正常觸發(fā)
div.detach().appendTo(document.body);
//DOM的removeChild也是如此,click事件依然可以正常觸發(fā)
document.body.removeChild(div[0]);
document.body.appendChild(div[0]);
});
當前題目:jQuery的append對應(yīng)的是detach還是remove
網(wǎng)頁URL:http://newbst.com/news20/320370.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信小程序、域名注冊、品牌網(wǎng)站制作、動態(tài)網(wǎng)站、建站公司、Google
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源:
創(chuàng)新互聯(lián)