事件委托好处:

1.提供性能。

2.添加元素仍然有以前的事件效果。

js片段

window.onload = init;
function init(){
    var oUl =document.getElementById('ul');
    var oInput = document.getElementById('input');
    var iNow =4;
    oInput.onclick = function(){
        iNow++;
        var oLi = document.createElement('li');
        oLi.innerHTML = ""+iNow+"";
        oUl.appendChild(oLi);
        }
    oUl.onmouseover=function(ev){
        var ev = ev || window.event;
        var target =ev.srcElement||ev.target;
        if(target.nodeName.toLocaleLowerCase()=="li"){
            target.style.backgroundColor="red";
            }
        }
    oUl.onmouseout=function(ev){
        var ev = ev || window.event;
        var target =ev.srcElement||ev.target;
        if(target.nodeName.toLocaleLowerCase()=="li"){
            target.style.backgroundColor="";
            }
        }
    }

html片段

<input id="input" type="button" value="点击" />
<p>1.提高性能</p>
<p>2.新添加的元素还会有以前的事件例如微博应用</p>
<ul id="ul">
    <li>11111</li>
    <li>22222</li>
    <li>33333</li>
    <li>44444</li>
</ul>

posted on 2013-03-04 14:42  apple_半个苹果  阅读(162)  评论(0编辑  收藏  举报