编写jQuery选择器的技巧

Question

在编写jQuery时，最重要但最棘手的事情是选择器。

  

您有什么建议来编写准确的选择器？

Answer 1

研究manual。

Answer 2

这是我的小费......

将其保存在书签中：

http://www.learningjquery.com/2006/11/how-to-get-anything-you-want-part-1

Answer 3

对选择器进行性能测试

是的，在Chrome的8个核心中，一切都是我的笨拙。但后来我假装我是一个客户端并在一台900 mHz的IE6机器上访问（不要笑，我保留其中一个在我旁边来测试这些东西）突然我可以在我的选择器返回时获得午餐。

我改变了一些代码：$（'。class，.class2，.class3'）。show（）

这样的事情：array.push（$（this））... $（array）.show（） 加速100倍

Answer 4

不能直接回答您的问题，但就性能而言，选择器是 2nd 最重要的事情。

大多数重要的是context parameter到$()。如果没有提供，jQuery默认为document。这意味着您正在遍历整个DOM 树。在指定了上下文的情况下，jQuery只在其下面遍历：

$('whatever'); // scans the entire `document`
$('whatever', element); // scans only within element

Answer 5

通过使用类装饰器来识别类似元素，可以轻松编写选择器。

 <div class="clickable">.....</div>
 <a class="clickable">...</a>
 <span class="clickable">...</span>

 $('.clickable').click( function() { some common click action } );

Answer 6

请记住CSS Specificity，因此您不要选择多少元素。

Answer 7

尽管class和id是最容易计划的，但我发现我越来越关注属性选择器和jQuery的伪伪类。最近必不可少的两个是:has()和:not()。如果您知道如何使用它们，属性选择器也非常方便，尽管它们的功能相当有限。我希望在选择器引擎中看到的一个改进是否定:has()，否定[attribute]。

Answer 8

我使用过SelectorGadget。如果HTML不太复杂，它的工作效果相当不错。

Answer 9

看一下John Resig’s presentations about jQuery，尤其是与其表现有关的那些。

要点是jQuery从右到左处理选择器而不是从左到右处理选择器。因此，选择器foo bar将选择所有bar元素并过滤那些具有foo元素作为祖先的元素，而不是首先选择所有foo元素，然后选择所有bar元素1}}每个foo元素的元素。这种技术避免了昂贵的合并。

所以你的最后一个子选择器应该是最具表现力的，而其他的则不那么具有表现力。

Answer 10

与其他任何内容一样，在使用之前了解库的工作原理。