减小事件绑定

 <ul id='ul'>
        <li id="1">click</li>
        <li id="2">click</li>
        <li id="3">click</li>
        <li id="4">click</li>
    </ul>


想象一下现在我们有一个10列、100行的HTML表格，你希望在用户点击表格中的某一单元格的时候做点什么。比如说我有一次就需要让表格中的每一个单元
格在被点击的时候变成可编辑状态。如果把事件处理器加到这1000个单元格会产生一个很大的性能问题，并且有可能导致内存泄露甚至是浏览器的崩溃。相反
地，使用事件代理的话，你只需要把一个事件处理器添加到table元素上就可以了，这个函数可以把点击事件给截下来，并且判断出是哪个单元格被点击了。
  <script>
        var ul = d.getElementById('ul');

        ul.onclick = function(e)
        {
           e = e || window.event;
           var obj = e.target || e.srcElement;
           obj.className = 'color';
           //alert(obj.id); 
//obj指向当前点击的li元素           
//alert(this.id);
//this指向ul         }
        /*
        for(var i = 0 ; i < lis.length ; i++)
        {
            lis[i].onclick = function()
            {
                alert(this.id);
            }
        }
        */
    </script>