表行单击事件经文链接

Question

我在桌子上有大约3000行。显示集合的一些数据。例如用户的集合。我在行中有名字，姓氏，父亲的名字。

user1First  user1Last  user1Father 
user2First  user2Last  user2Father 
user3First  user3Last  user3Father

我需要一个操作，以便查看用户的完整详细信息。我有三个选择 -

1. 将点击事件绑定到各个行。

   1. 使用jquery或
   2. onclick属性

2. 将单击事件绑定到整个表并使用事件冒泡

3. 向行添加链接列

从性能的角度来看，上述三个中哪一个最便宜且最便宜。有没有其他方法来实现这一点，并且性能友好。

绩效标准 -

1. 速度是最重要的。

   1. 将行添加到表中时没有UI阻塞。 - 我使用jquery append
   从服务器到达时添加异步
   2. 解除时间也很重要，因为我在删除视图时清理了所有事件。

2. 内存是次要的，但不要忽略，因为我也在移动设备上运行应用程序。

附加说明： 我正在使用backbone.js。用于事件绑定。每一行都是骨干视图[如果我使用链接就可以删除] 它是一个marionette.collection视图

Answer 1

毫无疑问，将click事件附加到表并使用事件冒泡是最佳选择。这既有效又有效。

如果您在点击链接时触发ajax请求，则添加到列的链接将与您的第一个选项相同。

Answer 2

不要忘记，无论您是否在DOM树上方附加事件处理程序，事件都会冒泡。

委派事件的主要性能批评是针对并不总是触发的事件绑定。例如，如果您将一个委托事件附加到表中并且某些行适合选择器而其他一些不适合，那么每次事件检查CSS选择器时都会产生性能损失无论行是否符合规定的标准，都会在表格中冒泡。

如果你附加一个委托的处理程序，那么你所遇到的性能是否以及有多少取决于选择器。例如，如果您的选择器为“td”，则检查只需一步：e.target.tagName === 'TD'。但是，如果您的选择器为“tr”，则检查涉及取消引用e.target的父级以发现是，该元素 是“tr”并且事件将会发生。

对于大部分委托事件，这些事件绑定在事件源附近，并且在事件发生时通常与选择器匹配，不会导致很多的性能损失。通常代码简单性和内存使用率在这些情况下都会胜过，而应该使用委托。