我有一个网格,并且有一个列包含<a>
锚标记,其中包含<data-..>
标记中的一些其他信息,并且具有类名<class='myspeciallink'>
。在我不引人注目的JS脚本中,我选择具有该类名的所有元素并应用live('click')
。我需要它是live()因为网格是在运行时生成的。
live('click')
处理程序内部会发生什么?我使用其他数据并根据该数据向页面添加<div>
。而这又用于生成jQuery UI对话框。它在我的电脑上运行良好。
但是!怎么能在现实世界中发挥作用?我是否应该对可能的性能影响感到困扰?我觉得瞬间对十几个元素应用live() 会影响性能。特别是像我这样的处理器相当复杂 - 它需要获取数据,解析数据,创建div,应用对话框等。
这闻起来像一个糟糕的设计吗?你能否提出一个不同的方法,或者我的担忧是没有根据的?我可以使用某种分析器工具来查找我的javascript中的瓶颈吗?
UPD:仍然没有人建议使用任何分析工具。 firebug和chrome dev工具很好,但也许有更好的东西?
答案 0 :(得分:4)
live("click")
实际上是更好的前提:你不是将事件处理程序绑定到每个匹配的元素,而是应用单个事件处理程序,等待事件冒泡,然后查看是否触发事件的元素与调用选择器.live
匹配。
将此与$('selector').click(...)
进行比较,其中 循环遍历每个元素并绑定新的事件处理程序。无论有多少页面元素与其选择器匹配,live('click')
都没有额外的开销。根据您的选择器匹配的元素数量,使用.live
可以避免在每个页面的初始加载期间延迟最多几秒。
但是,事件处理程序必须检查与其选择器相关的每个事件,以查看是否存在匹配。这会给每次点击事件增加少量开销,但很可能你的用户不会注意到差异。
答案 1 :(得分:2)
Peter bailey也有一篇很好的帖子:Performance difference between jQuery's .live('click', fn) and .click(fn)