Heim > Web-Frontend > js-Tutorial > Hauptteil

关于js内存泄露的一个好例子_javascript技巧

WBOY
Freigeben: 2016-05-16 17:10:12
Original
1171 Leute haben es durchsucht

我把别人的例子改了一下,觉得这样写更紧凑!套用别人的原话,当一个DOM对象包含一个Js对象的引用(例如一个Event Handler), 而这个Js对象又持有对这个DOM对象的引用时,一个环状引用就行成了,于是在ie下就出现了内存泄露。点击“运行代码”并打开任务管理器看内存变化。分别在ie8和ff下测试,差距不用多说。

运行代码

复制代码 代码如下:


 
    Memory leak
   
 
 
 
  <script><BR> var q = [];<BR> var n = 0;<BR> setInterval(function(){<BR> q.push(makeSpan());<BR> if(q.length>=10){<BR> var s = q.shift();<BR> if(s){<BR> s.parentNode.removeChild(s);<BR> }<BR> }<BR> n++;<BR> },10);<br><br> function makeSpan(){<BR> var s = document.createElement("span");<BR> document.body.appendChild(s);<BR> var t=document.createTextNode("*** " + n + " ***");<BR> s.appendChild(t);<BR> s.onclick=function(e){<BR> s.style.backgroundColor="red";<BR> alert(n);<BR> };<BR> return s;<BR> };<BR> </script>


那么在ie下该怎么解决呢?

在删除节点的时候,手动破除环状引用,把里面setInterval那段代码稍微改动以下:

复制代码 代码如下:

setInterval(function(){
  q.push(makeSpan());
  if(q.length>=10){
    var s = q.shift();
    if(s){
     s.onclick = null;//关键在这里
      s.parentNode.removeChild(s);
    }
  }
  n++;
},10);
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage