自身认知限制，在之前做项目使用jquery框架的时候会直接使用$(obj).click(function(){})（click可以换成其他的事件）为目标对象绑定事件，并没有觉得有什么不妥。今天看了一篇博客惊着了。原来光是知其然，不知其所以然。
例子如下：在页面中添加1000个p标签，再给他们绑定事件。用两种绑定方式分别统计内存消耗。
<!DOCTYPE html>
<html>
<head>
<title>javascript</title>
</head>
<body>
<div id="content"></div>
</body>
<script type="text/javascript" src="js/jquery-2.0.3.js"></script> <!--此处引入自己的jquery库文件-->
<script type="text/javascript">
$(function(){
var doms = "";
for(var i = 0; i<1000;i++){
doms+="<p>测试"+i+"</p>";
}
$("#content").html(doms);
//第一种事件绑定方式
$("#content p").click(function () {
$("#content").append("<p>我是后来的呀</p>");
});
//第二种事件绑定方式
$("#content").on("click","p",function () {
$("#content").append("<p>我是后来的呀</p>");
});
})</script></html>
第一种事件绑定方式消耗内存为3.2M，如下图：
第二种事件绑定方式内存消耗为2.7M，如下图：
两种方式内存消耗相差很多。明显第二种使用on的事件委托形式更优，如果项目中有类似的需求，还是择后者。并且后者还支持动态绑定。