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

Question

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

Nik*_*man 6 javascript internet-explorer memory-leaks internet-explorer-9

我注意到为动态创建的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>

Run Code Online (Sandbox Code Playgroud)

我注意到从表行中删除所有单元格导致内存泄漏缩小,所以我猜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];

Run Code Online (Sandbox Code Playgroud)

Answer 1

Nik*_*man 2

我在我的案例中找到了一个合适的解决方案，注意到在“运行”一段时间后重新加载包含的测试页会导致内存使用量暂时保持不变（相对于重新加载之前运行的时间）。之后又开始上涨。

所以，看起来，是的，IE 在删除元素后并没有完全删除 ID:d 元素使用的资源，但如果再次将相同的 ID 添加到页面，它显然会重新使用这些资源。

因此，只需确保添加和删除的 ID 是有限集合的一部分，而不是无限集合的一部分。测试页使用严格递增的基于整数的 ID，而我最初的问题案例使用类似的序列号 ID。幸运的是，在这两种情况下都很容易将它们固定在有限的范围内。

对于上面的测试代码：

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

归档时间：	14 年前
查看次数：	2155 次
最近记录：	14 年前