ID属性为的动态DOM对象的IE9内存泄漏

IE9 memory leak for dynamic DOM objects with ID attribute

本文关键字：IE9 内存 泄漏 对象 动态 属性 ID DOM      更新时间：2023-09-26

我注意到，为动态创建的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。幸运的是，在这两种情况下都很容易将它们固定在有限的范围内。

对于上面的测试代码：

++计数；如果（计数>1000）计数=0

在我的Java Swing时代（是的，是的，我老了），JVM也有类似的问题。在这种情况下，垃圾回收器将无法清理嵌套在其他Swing对象中的Swing对象，从而导致内存泄漏。

我过去常常通过显式地将每个Swing对象设置为NULL来解决这个问题，因为它们不再需要了。

在深度嵌套对象（即包含其他Swing对象的Swing表）的情况下，我编写了一个递归方法，所有Swing类都可以使用该方法，该方法将遍历任何Swing对象，将其中找到的每个对象都设为NULL。

令人恼火的是，为了解决JVM的垃圾收集器中的一个错误，我不得不付出所有这些额外的努力，但它运行得很好。一旦我有了这个，内存泄漏就消失了。

用IE9尝试类似的东西可能是值得的。在不再需要DOM对象时将其强制为NULL，可能会为您解决此问题。还有我们其他人…：-）

相关文章：