IE6标签事件动态绑定导致崩溃

报错原因

前两天做一个用户列表的应用，右键用户头像弹出一个菜单选项。这应该是JavaScript最容易实现的一个功能的，使用JavaScript事件即可实现。但是测试的时候，其它浏览器都没有问题，唯独IE6报错：

这个问题，有点棘手。因为它不是单纯的JavaScript报错。因为用户列表是动态创建的，即可能有一个用户进入房间就在列表里增加一个用户，离开一个用户就从列表里删除这个用户，不好调试，我改成静态的测试。发现没有崩溃，也没有报错。

正在左思右想，感觉IE6容错性能很低，就怀疑是JavaScript动态创建绑定用户列表事件导致内存占用过多。因为用户列表是动态创建的，而绑定右键的方法是写在一个函数里。如：

function bind() {
  var obj = document.getElementsByTagName('li')

  for(var i = 0; i < obj.length; i++) {
    obj[i].onclick = function () {
      ...
    }
  }
}

每当用户列表发生改变（删除、或者添加、或者重建）时就调用一次绑定函数，经过查找资料，发现是IE6对JavaScript内存释放的机制太落后导致。

比如我列表里有是个用户，并且已经绑定了右键侦听，然后我删除列表里这十个用户的DOM节点，在IE6里不会因为DOM节点删除而去自动释放侦听事件的资源，导致内存占用随着DOM节点的不断变化而越来越耗费内存资源，最终就报错崩溃。

解决方法

网上有人说，可以再删除DOM节点之前解除事件绑定在删除，这或许能解决。但我认为更有的方法是把事件写到标签里，如：

<button onclick="bind()">click</button>

这样的方式更好，删除DOM节点，事件也被释放了。

要么，你可以忽略IE6这种破烂的浏览器，一笑而过！