2
我遇到了一个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?我检查了活动监视器,并且页面继续运行时间越长,内存越多。