Question

我刚读这个： http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx

对一些主张的伎俩有一些疑问：

9 - 为您的选择者提供背景信息：

使用上下文和使用更具体的选择器有什么区别？

而不是做

var selectedItem = $('#listItem' + i, $('.myList'));

怎么样？

var selectedItem = $('.myList>#listItem' + i);

哪一个更快/更好，或者没有区别？

12 - 了解活动授权：

我认为在低处理程序计数时，事件委托比正常绑定慢。

您应该开始使用事件委派的时间是多少处理程序？

此外，在dom中使用委派和创建单击目标，让用户单击该单击目标，然后让单击目标找到之间有什么区别（就多快或多好'而言）要操纵的元素。这种方法更快还是授权更快？

编辑：此外，您应该委派多少级别？委托10个级别的东西，或简单地绑定2个处理程序是否更好。

13 - 使用类来存储状态

14 - 更好的是，使用jQuery的内部数据（）方法来存储状态：

为什么要使用数据与类？数据更快吗？我认为我通常会发现课程更容易阅读，与博客条目中的内容相矛盾，因为我可以在DOM中看到它。

谢谢！

Answer 1

9 - 为你的选择者提供一个背景：
var selectedItem = $('#listItem' + i, $('.myList'));
V / S
var selectedItem = $('#listItem' + i);

根据文章，第一篇应该更快。但我看不出这是怎么回事......

首先通过ID访问是获取元素的最快方法之一。它只是从全局ID-s哈希表中查找。添加上下文应该不会增加速度。查找上下文应该花些时间，因此第一个示例应该更慢。

我也进行了一些测量，发现确实第一次测量速度慢很多。

至于此：

var selectedItem = $('.myList>#listItem' + i);

这应该与第一个速度大致相同。根据我的测量，它确实差不多，只是快一点。

但是在处理其他类型的选择器时，指定上下文可能是有益的，特别是你重用它，就像那样：

var ctx = selectedItem = $('.myList')
for (var i=0; i<1000; i++) {
    var selectedItem = $('.listItem' + i, ctx);
}

在这个例子中，它为你提供了相当大的速度提升。

与其他与表现相关的内容一样 - 在知道某些事情是否适用于您的具体情况之前，您必须先进行衡量。

您应该开始使用事件委派的时间是多少处理程序？

当我觉得页面很慢时。 99％的正常事件处理程序都足够好。

Answer 2

我无法回答所有问题，但可能会提供一些有用的相关信息。

9 - 为你的选择者提供一个背景：

第一个更复杂，因为这样你可以传递一个iframe元素并在那里查找。我认为性能没有差异。

来自文档：

JQuery（表达式，上下文）
jQuery的核心功能围绕这个功能。 jQuery中的所有内容都基于此，或以某种方式使用它。这个函数最基本的用法是传入一个表达式（通常由CSS组成），然后找到所有匹配的元素。

默认情况下，如果未指定上下文，$（）将在当前HTML文档的上下文中查找DOM元素。如果确实指定了上下文，例如DOM元素或jQuery对象，则表达式将与该上下文的内容进行匹配。

14 - 更好的是，使用jQuery的内部数据（）方法来存储状态：

此功能可用于将数据附加到元素，而无需创建新的expando。它也不仅限于字符串。值可以是任何格式。类更通用，在这里您可以使用元素或元素集绑定数据。它可以在某些角度用作元数据。

PS。您可以找到更多信息here

Answer 3

对于（9）

因为只有一个元素具有给定的 id ，所以额外的东西似乎并不是必要的...... 除非你是测试它是否确实存在（在那个确切的嵌套中）

如果情况相反（例如，上下文非常具体，并且您想要的所选元素相当通用），我可以看到这将如何帮助......

//LI elems with CSS class "foo"
//but only inside the element with the ID "onlyInHere"
$('li.foo', '#onlyInHere')

Answer 4

关于＃9：

当您为选择器查询提供上下文时，您限制所遍历的树的大小以查找与您的选择器匹配的元素，尤其是当您使用使用标记名称的选择器时：$（'div＆gt; span' ）。

性能取决于选择器的类型和您提供的上下文中的元素数量。

请查看getElementsByTagName以更好地了解这些问题。

至于“哪一个更好” - 这在很大程度上取决于被遍历的DOM的大小以及许多其他元素，但一般来说，第一个选择器（具有上下文的选择器）应该更快。 / p>

关于＃12：

通常，当父元素（例如，表格中的单元格）中的子元素数量未知且预计非常大时，最好使用事件委派。这通常适用于从服务器提取数据的情况。常见的场景是树和网格结构。

关于＃13：

我认为您所指的文档中提供的示例可以完成这项工作，但我会尝试进一步详细说明。类是将附加信息附加到HTML节点的常用标准方法。让我们以标签栏为例：假设您有一个适用于标签栏中每个标签的标准类“标签”，您可以在其中一个标签上添加一个附加类，以表明它当前已被选中。添加一个名为“selected”的附加类将允许您将不同的样式应用于所选选项卡，并使用jQuery查询选项卡栏以获取一些其他逻辑（例如：检查当前选择哪个选项卡来执行HTTP请求并检索内容对于此标签）。

关于＃14：

类可以（或应该）存储在其中的数据类型和数量受到限制。数据是一种更灵活的方式来存储HTML元素的大量状态数据。

关于25个jquery提示的一些问题

4 个答案: