我注意到为动态创建的 DOM 对象分配 ID 属性值会导致 IE9 泄漏内存。有没有其他人经历过这种情况，更重要的是，知道任何解决方法？它在其他浏览器中不会泄漏，即使是 IE6 也能通过!
泄露代码演示:
它只是连续地从表中添加和删除行，并为每一行分配一个 ID 以供稍后查找。
没有“row.id = eid;”就不会发生泄漏
<html>
<head>
<script type="text/javascript">
function addRow(tbl, index) {
var row = tbl.insertRow(index);
var eid = "loongrowid" + count;
row.id = eid;
for (var i = 0; i < 9; i++) {
row.insertCell(i);
}
return row;
}
function removeTableRow(tbl, index) {
var row = tbl.rows[index];
tbl.deleteRow( index );
}
var count = 1;
function fillRow(row){
row.cells[0].innerHTML = '<input type="checkbox"' + ' checked="checked"' + ' />';
for (var i = 1; i < 9; i++) {
row.cells[i].innerHTML = count + " c";
}
++count;
}
var added = false;
function dostuff()
{
var tbl = document.getElementById("tbl");
var i;
if (added)
{
for (i = 0; i < 20; ++i)
{
removeTableRow(tbl,1);
}
}
else
{
for (i = 0; i < 20; ++i)
{
var row = addRow(tbl, i+1);
fillRow(row);
}
}
added = !added;
setTimeout(dostuff, 1);
}
</script>
</head>
<body onload="setTimeout(dostuff, 1)">
<h1 id="count">TESTING</h1>
<table id="tbl" style="width:100%;">
<tr>
<th>selected</th>
<th>date</th>
<th>time</th>
<th>place</th>
<th>device</th>
<th>text</th>
<th>state</th>
<th>status</th>
<th>quality</th>
</tr>
</table>
</body>
</html>
我注意到从表格行中删除所有单元格会导致内存泄漏缩小，所以我猜 IE 在从表格中删除后会保留该行。
我还尝试了一种解决方法，将创建的表行添加到一个 Javascript 对象中以用作哈希表，而不是依赖于 getElementById(row.id) 但由于某种我看不到的原因，它也泄漏了。
var hash = [];
// when creating row
row.extid = eid; // Note: this by itself causes no leak
hash[eid] = row;
// when removing row
delete hash[row.extid];
最佳答案
我发现在我的案例中找到了一个合适的解决方案，注意到在“运行”一段时间后重新加载包含的测试页面会导致内存使用暂时保持不变(相对于它在重新加载之前运行的时间)。之后又开始上涨。
因此，看起来，是的，在删除元素后，IE 不会完全删除 ID:d 元素使用的资源，但如果再次将相同的 ID 添加到页面，它显然会重新使用这些资源。
因此，只需确保添加和删除的 ID 是有限集合的一部分，而不是无限集合。测试页面使用严格递增的基于整数的 ID，而我的原始问题案例使用了相似的序列号 ID。幸运的是，在这两种情况下都可以很容易地将它们固定在一个有限的范围内。
对于上面的测试代码:
++计数； if (count > 1000) count = 0;
关于javascript - 具有 ID 属性的动态 DOM 对象的 IE9 内存泄漏，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9176225/