如何從內存中刪除動態創建的div？

我遇到了一個JavaScript隨機在頁面上創建背景div（在我的網站的背景上創建這些浮動圈）的問題。該腳本在一定間隔上運行：如何從內存中刪除動態創建的div？

var floatInterval = window.setInterval(createFloaters, 10000); 
function createFloaters() 
      { 
       lastHeight = 0; 
       pageOffset = $('#logo').offset(); 
       for(j = 0; j<10; j++) 
       { 
        randomSize = j * Math.random()*20; 
        randomTop = Math.random()*randomSize + lastHeight + Math.random()*10 + 10; 
        plusOrMinus = [-1,1][Math.random()*2|0]; 
        randomColorNum = Math.floor(Math.random()*colArr.length); 
        randomColor = colArr[randomColorNum]; 
        randomLeft = Math.random()*990 + pageOffset.left; 
        randomOpacity = Math.random()*.5; 

        $('#floatContainer').append('<div class="circle d' + j + '" style="width:' + randomSize + 'px; height:' + randomSize + 'px; position: absolute; top:' + eval((randomTop - Math.random()*500)*plusOrMinus) + 'px; left:' + eval((randomLeft + Math.random()*200)*plusOrMinus) + 'px; border-radius:' + randomSize + 'px; background:' + randomColor + '"></div>'); 
        lastHeight += randomSize; 
        $('.d' + j).delay(Math.random()*500).animate({top: randomTop, left: randomLeft, opacity: randomOpacity}, Math.random()*5000 + 5000).fadeOut().queue(function(){ 

        $(this).remove(); 


        }); 
       } 

       console.log('FLOAT LENGTH: ' + $('#floatContainer div.circle').length); 
      }

一旦創建了一個浮動圓圈，它就會進行動畫處理並將其移除。看起來div並沒有被完全刪除。

當我追蹤出正在創建的div的數量，並將焦點集中在標籤上時，我得到了一些正常的東西。

Number of Divs: 13 
Number of Divs: 21 
Number of Divs: 13 
Number of Divs: 21 
Number of Divs: 13 
Number of Divs: 21

然後我切換標籤，坐在那裏幾分鐘，恢復到原來的標籤，這是我所看到的：

Number of Divs: 187 
Number of Divs: 197 
Number of Divs: 207 
Number of Divs: 13 
Number of Divs: 21 
Number of Divs: 13 
Number of Divs: 21 
Number of Divs: 13 
Number of Divs: 21

我能做些什麼來解決這個問題？你如何從內存中永久刪除動態創建的div？我檢查了活動監視器，並且頁面繼續運行時間越長，內存越多。

來源

2012-06-08 pfunc

您使用的隊列錯誤。只需添加一個回調fadeOut。

.fadeOut(function(){$(this).remove();});

來源

2012-06-08 22:59:03

如何從內存中刪除動態創建的div？

回答

相關問題