jQuery live（）函数原理及实现

实现原理：
其实就是将事件绑定到父节点,由于事件冒泡，所有事件最终会冒泡到document节点
当有事件触发时，则判断事件类型和触发事件的元素是否一致，如果相同则执行函数<！doctype html>
<html>
<head>
<title>jquery live（）函数原理及实现</title>
<style type="text/css">
table{
border-collapse:collapse;
border-spacing:0;
}
td{
border:1px solid #cdcdcd;
}
</style>
<script type="text/javascript">
function live（target, type, fn）{ //元素类型，事件类型，执行函数
document.onclick = function（event）{
var e = event ？ event : window.event;
addRow（）;
if（e.type == type && e.target.tagName.toLocaleLowerCase（） == target）{
fn（）; //如果元素类型和事件类型同时匹配,则执行函数
}
}
}
function addRow（）{
var x=document.getElementById（"tb"）.insertRow（0）;
var y=x.insertCell（0）;
var z=x.insertCell（1）;
y.innerHTML="NEW CELL1";
z.innerHTML="NEW CELL2";
}

//实例:将所有的td（包括后续js添加的）绑定click事件
live（"td", "click", function（）{
alert（"live"）;
}）;
</script>
</head>
<body>
<table id="tb">
<tr>
<td>..........................................</td>
<td>..........................................</td>
</tr>
<tr>
<td>..........................................</td>
<td>..........................................</td>
</tr>
<tr>
<td>..........................................</td>
<td>..........................................</td>
</tr>
</table>
</body>
</html>jQuery 的详细介绍：请点这里
jQuery 的下载地址：请点这里推荐阅读：jQuery完成带复选框的表格行高亮显示 http://www.linuxidc.com/Linux/2013-08/89406.htmjQuery完成带单选按钮的表格行高亮显示 http://www.linuxidc.com/Linux/2013-08/89407.htmjQuery 获取json数据[$.getJSON方法] http://www.linuxidc.com/Linux/2013-03/81673.htmjQuery去掉字符串起始和结尾的空格 http://www.linuxidc.com/Linux/2013-03/81573.htmjQuery显示和隐藏div特效demo http://www.linuxidc.com/Linux/2013-03/81452.htmjQuery中取得dom的值的三种方法之区别 http://www.linuxidc.com/Linux/2013-02/79834.htm