$( "#dataTable tbody tr" ).on( "click", function() {
alert( $( this ).text() );
});
$( "#dataTable tbody" ).on( "click", "tr", function() {
alert( $( this ).text() );
});
tr是tbody的子元素，tr上的click事件会冒泡到tbody上。
第一种方式，是监听tr元素的click事件；
第二种方式，是监听tbody的click事件，然后检查触发事件的target是tr元素时（从tr冒泡而来）触发
第二种方式被称作事件代理，即后代元素（tr）的触发的事件等到冒泡至父元素（tbody）时再处理
什么时候使用委托事件：
1.对未被创建的元素添加事件监听
2.避免频繁添加或删除event handler，委托父元素来进行事件处理
使用委托事件的优点：
1.大量减少监听元素的开销
使使用后果，不用每个tr都进行事件绑定，只需要在tbody处进行绑定即可，委托tbody进行对tr点击的响应。
大神的分享：事件的委托处理（Event Delegation）
javascript的事件模型，采用"冒泡"模式，也就是说，子元素的事件会逐级向上"冒泡"，成为父元素的事件。
利用这一点，可以大大简化事件的绑定。比如，有一个表格（table元素），里面有100个格子（td元素），现在要求在每个格子上面绑定一个点击事件（click），请问是否需要将下面的命令执行100次？
$("td").on("click", function(){
$(this).toggleClass("click");
});
回答是不需要，我们只要把这个事件绑定在table元素上面就可以了，因为td元素发生点击事件之后，这个事件会"冒泡"到父元素table上面，从而被监听到。
因此，这个事件只需要在父元素绑定1次即可，而不需要在子元素上绑定100次，从而大大提高性能。这就叫事件的"委托处理"，也就是子元素"委托"父元素处理这个事件。
$("table").on("click", "td", function(){
$(this).toggleClass("click");
});
更好的写法，则是把事件绑定在document对象上面。
$(document).on("click", "td", function(){
$(this).toggleClass("click");
});
如果要取消事件的绑定，就使用off()方法。
$(document).off("click", "td");