Javascript jQuery委托事件方法对网格的好处

假设我有一个网格/表，其中包含大量数据，比如1000行和每行的事件处理程序

现在有两种方法可以实现同样的目标

一,

及 2.

请解释2种方法之间的基本区别，以及它如何帮助渲染/性能……

阅读

由于javascript添加的新元素在DOM就绪或页面加载时不是DOM的一部分，因此您必须使用

这是活动代表团

$("#dataTable tbody").on( "click", "tr", function() {

上述代码的解释

我们将事件处理程序附加到id为

dataTable

包含

tbody

标记的元素，这样，如果动态添加了更多

tr

，那么

单击
事件将处理新添加的
tr

但如果使用下面的代码，则新添加的
tr
将不会附加
单击事件处理程序


如果元素在DOM就绪或页面加载时出现在DOM中，下面的代码将起作用

$( "#dataTable tbody tr" ).on( "click", function() {}

等于

$( "#dataTable tbody tr" ).click(function() {});

当匹配选择器的元素动态更改时，必须使用委托（方法2）。您应该仅在必要时使用此功能。它在选择器中应用
.on
的元素上建立一个处理程序，然后必须测试目标元素是否与参数列表中的选择器匹配；这取决于从内部元素冒泡到绑定到的元素的事件。这比直接绑定到目标元素的效率要低，因为浏览器完全是自己实现的

当元素是静态的时，应使用第一种形式。当DOM就绪时，选择器将匹配所有这些对象，并将处理程序绑定到每个对象。
Thx很多…您能否详细介绍它们之间的渲染/性能优势比较。。。
$( "#dataTable tbody tr" ).on( "click", function() {}

$( "#dataTable tbody tr" ).click(function() {});