jQuery选择器最佳实践--来自jQ官网

 

1、基于ID选择器进行查询,并且使用find方法。

1 //快速
2 $("#container div.footer");
3 
4 //超快
5 $("#container").find("div.footer");

 使用find方法会减少遍历节点的时间。

2、使用混合选择器时,在右边的选择器最好具体一些。

1 //优化前
2 $("div.data .footer");
3 
4 //优化后
5 $(".data div.footer");

左边最好只使用tag或class这样的选择器,右边最好使用tag.class这样的方式。

3、避免使用过多的选择器。

1 //糟糕
2 $("div p.data span.test");
3 
4 //很好
5 $("div span.test");

这样可以减少选择器引擎遍历节点的时间。

4、避免使用通用的选择器,会花费很多查找时间。

1 $(".buttons > *");            // Extremely expensive.
2 $(".buttons").children();   // Much better.
3  
4 $(".category :radio");        // Implied universal selection.
5 $(".category *:radio");       // Same thing, explicit now.
6 $(".category input:radio"); // Much better.

 

posted @ 2014-12-09 17:26  Yanyd  阅读(269)  评论(0编辑  收藏  举报