为了优化 jQuery 的性能而为数百个元素添加 ID 是否值得？答案

【问题标题】：Is it worth the trouble to add IDs to hundreds of elements for the sake of optimizing jQuery's performance?为了优化 jQuery 的性能而为数百个元素添加 ID 是否值得？
【发布时间】：2013-02-06 22:32:36
【问题描述】：

我需要在一个网站上使用 jQuery 进行大量 HTML 操作，其中数百种产品以相同的结构显示。几乎每个代码块都单独包装在具有相同类名的 div 容器中。

现在我想知道是否应该在类名中插入一个唯一 ID，以便可以使用 $('#ID') 而不是 $('.class') 进行 HTML 操作。从this article #3 获取想法。

我可能会使用 for 循环在类之后插入一个 id 来创建 ID。这值得花时间吗？更重要的是它会对性能有所帮助吗？

编辑： 对于我将要进行的操作类型，for 循环肯定会经常使用。此外，我不太确定分页是否对性能有任何意义。现在产品每页显示 10 个，用户可以选择每页查看更多。

【问题讨论】：

如果你现在用类检索元素做某事，并打算按类做同样的检索添加ID，然后通过ID检索元素，不，不是！
您可以通过指定父标签类型等来使其更好，例如 div#Parent span.spanChild h1
无需使用ID 选项指定标签名称，因为ID 已经是您可能获得的最具体的了。
@nathanhayfield，我对页面中已有的每个产品都有一个跨域请求，但它的视觉速度越来越慢。
如果您为数据库编制索引，它可能会加快速度

标签： jquery performance jquery-selectors dom-manipulation

【解决方案1】：

是的，ID 选择器要高效得多。使用它们来缩小您的范围，然后您可以稍后按班级进行选择。此外，保存可能重复使用的选择。

var container = $("#someId");
var products = container.find(".product");

//later on...

products.find(".class").doSomething();

另外，请记住 .children() 比 .find() 更有效 - 所以尽可能使用它。

【讨论】：

【解决方案2】：

这样做可能是个好习惯，但只有当页面很大（有很多元素）或多次选择元素（即在循环内）时，您才会注意到差异

从循环中选择你需要的元素并在内部使用对它的引用会更好、更容易

var obj = $('#someid');
while (expression){obj.something();}

【讨论】：