js 委托事件的实现

测试代码


测试结果：[b]使用事件委托方式性能要高的多[/b]



<div id="test_id">
<a href="#" id="11">111111</a>
<a href="#" id="22">222222</a>
<a href="#" id="33">333333</a>
<a href="#" id="44">444444</a>
<a href="#" id="55">555555</a>
<a href="#" id="66">666666</a>
<a href="#" id="77">777777</a>
</div>

1、jquery实现：

$("#test_id").delegate("a", "click", function(event){
var event = event || window.event;
$("#test_id").find("a").each(function(){
$(this).removeClass("current");
});
$(event.target).addClass("current");
});

2、js实现：

var obj = document.getElementByIdx_x("test_id");

obj.addEventListener("click", function(event){
var event = event || window.event;
for(var i=0; i<this.childNodes.length; i++){
if(this.childNodes[i].nodeName.toLowerCase() == 'a'){
this.childNodes[i].className = '';
}
}
var curElem = event.target;
if(curElem.nodeName.toLowerCase() == "a"){
curElem.className = "current";
}
});

原文链接：http://www.cnblogs.com/xqhppt/archive/2011/12/07/2279037.html