在以下代码中:
$(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;
});
});
加载是一个简单的链接,MyDiv是一个简单的div。在我测试的每个主要浏览器中,当我多次点击链接时,我看到任务管理器中的内存使用量上升。在IE中,它每次都会略微上升并保持不变。在FF中,它每次都会上升,但偶尔会下降(我认为这意味着内存正在被回收或垃圾收集 - 这是一个好兆头)。在Chrome中,它每次都会显着上升并保持不变。
首先,这段代码是否正确清理了DOM?如果是这样,为什么每次点击都会增加内存使用量?
注意:我尝试使示例尽可能简单,但类似于我在应用中遇到的问题。
答案 0 :(得分:2)
将其包裹在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;
});
});