有关js内存泄露的一个好例子

发布时间：2023-08-17 14:24:47 所属栏目：教程来源：

导读：我把别人的例子改了一下，觉得这样写更紧凑！套用别人的原话，当一个DOM对象包含一个Js对象的引用(例如一个Event Handler)，而这个Js对象又持有对这个DOM对象的引用时，一个环状引用就行成了，于是在ie下就出现了内

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

运行代码

代码如下:

<html>

  <head>

    <title>Memory leak</title>

    <style>

     body{

       padding: 10px;

     }

    </style>

  </head>

  <body>

  </body>

  <script>

    var q = [];

    var n = 0;

    setInterval(function(){

      q.push(makeSpan());

      if(q.length>=10){

        var s = q.shift();

        if(s){

          s.parentNode.removeChild(s);

        }

      }

      n++;

    },10);

    function makeSpan(){

      var s = document.createElement("span");

      document.body.appendChild(s);

      var t=document.createTextNode("*** " + n + " ***");

      s.appendChild(t);

      s.onclick=function(e){

                s.style.backgroundColor="red";

                alert(n);

            };

            return s;

    };

  </script>

</html>

那么在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);

（编辑：聊城站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!