在JQuery中附加事件处理程序。直接绑定与委派

时间:2013-08-01 05:29:50

标签: jquery binding delegates event-handling

我制作单页应用程序。 更改哈希时,会通过ajax将新元素加载到页面中。

我想为新元素设置一个事件处理程序。 有两种方式。

  1. 每个事件处理程序都在开始时委派。

    $("body").on(event, "element", handler)

  2. 每当更改哈希时,事件处理程序都直接绑定到新元素。 因此,重复绑定和删除处理程序。

    $("element").on(event, handler)

  3. 哪个表现更好? (找到元素时间与重复绑定删除时间) (对不起,我的英语很差......)

1 个答案:

答案 0 :(得分:0)

有关此单页应用程序如何工作的更多信息可能会有所帮助,但您可以考虑这些指南

  • 您的网页有多动态?如果它是相当静态的(不会改变,这可能是一个不成熟的优化)
  • 这里涉及多少个DOM元素?需要单独连接的DOM元素越多,必须完成的工作就越多,内存消耗就越多等等。
  • 您的DOM元素的嵌套程度如何?更深的嵌套,意味着更多的事件冒泡。
  • 在通过id查找元素的情况下,从jQuery的角度查找是非常快的,因为DOM元素id名称应该是唯一的,它通常只使用getElementById本机方法。
  • 在按标签查找元素的情况下,您应该有一个正文标记,但如果您正在选择它,则可能有几百个div标记。
  • 当您仍然不确定时,是时候让Chrome开发者工具参与进来,以帮助您进一步微调和诊断您可能遇到的潜在性能问题。
  • jQuery的选择器引擎非常强大且灵活,但并非所有选择器都执行相同的操作。您可以编写一个粗糙的选择器,不必要地使浏览器负担过重。

一般情况下,当我需要一大组项目来表现同样的事件时,我通常会利用事件委托。

我希望这很有帮助。