JavaScript 内存使用

Question

在下面的代码中:

$(document).ready(function() {
    var content = "";
    for (var i = 0; i < 1000; i++) {
        content += "<div>Testing...</div>";
    }
    $("#Load").click(function() {
        $("#MyDiv").empty();
        $("#MyDiv").append(content);
        return false;
    });
});

Load 是一个简单的链接，MyDiv 是一个简单的 div。在我测试过的每个主要浏览器中，当我多次单击链接时，我看到任务管理器中的内存使用量上升。在 IE 中，它每次都会略微上升并保持不变。在 FF 中，它每次都会上升，但偶尔会下降(我认为这意味着内存正在回收或垃圾收集 - 一个好兆头)。在 Chrome 中，它每次都会显着上升并保持不变。

首先，这段代码是否正确清理了 DOM？如果是这样，为什么每次点击都会增加内存使用量？

注意:我试图让示例尽可能简单，但与我在我的应用程序中遇到的问题类似。

Answer 1

将它包裹在一个 div 标签周围。它将极大地帮助并使用原生 innerHTML(速度更快)。

$(document).ready(function() { 
    var content = ""; 
    for (var i = 0; i < 1000; i++) { 
        content += "<div>Testing...</div>"; 
    } 
    $("#Load").click(function() { 
        document.getElementById('MyDiv').innerHTML = ('<div>'+content+'</div>'); 
        return false; 
    }); 
});