在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ 移除dom不調(diào)用removeEventListener

移除dom不調(diào)用removeEventListener

const addDOM = () => {
  const div = document.createElement('div')
  div.addEventListener('click', e => {})
  document.body.appendChild(div)
  div.remove()
}

let i = 99999999
while(i-- > 0) {
  addDOM()
}

如果我在移除一個(gè)dom節(jié)點(diǎn)前，不調(diào)用removeEventListener移除click的事件監(jiān)聽(tīng)，會(huì)不會(huì)有不好的影響？

回答
編輯回答
凹凸曼

就你給的code而言，不會(huì)有影響的，用chrome memery工具檢測(cè)一下，remove children之后，EventListener對(duì)象的數(shù)量會(huì)減少。

樓上jzoom的例子之所以能跑通，讓你感覺(jué)Listener沒(méi)有自動(dòng)gc，是因?yàn)樗膁iv是全局變量，所以即使從dom tree上移除，div對(duì)象仍然存在于global上被global引用著，那gc機(jī)制自然不會(huì)去清理它的listener，而題主你的div的scope是在addDom這個(gè)function里的，所以一旦999999個(gè)div從dom tree上被移除，則沒(méi)有對(duì)象引用它們，則它們身上的listener也會(huì)自動(dòng)被gc。

2017年6月2日 00:31
編輯回答
裸橙

題主試下代碼


const handle = e => { console.log('click event!') };
const div = document.createElement('div')
div.addEventListener('click', handle)
document.body.appendChild(div)
div.dispatchEvent(new Event('click'));
div.remove()
div.dispatchEvent(new Event('click'));
div.removeEventListener('click', handle);
div.dispatchEvent(new Event('click'));

在調(diào)用remove之后，使用dispatchEvent照樣可以輸出，說(shuō)明Listener并沒(méi)有隨著remove被移除。一定要手工調(diào)用removeEventListener才行。那么結(jié)論是會(huì)有影響。

clipboard.png

2018年4月12日 07:30