jQuery最佳实践

1. 使用最新版本的jQuery 2. 用对选择器 （1） 最快的选择器：id选择器和标签选择器 （2） 较慢的选择器：class选择器 （3） 最慢的选择器：伪类选择器和属性选择器 3. 理解子元素和父元素的关系 $('.child', $parent) $parent.find('.child') 最快 $parent.children('.child') $('#parent > .child') $('#parent .child') 最慢 $('.child', $('#parent')) 4. 不要过度使用jQuery jQuery速度再快，也无法与原生的javascript方法相比。所以有原生方法可以使用的场合，尽量避免使用jQuery。 5. 做好缓存 选中某一个网页元素，是开销很大的步骤。所以，使用选择器的次数应该越少越好，并且尽可能缓存选中的结果，便于以后反复使用。 6. 使用链式写法 采用链式写法时，jQuery自动缓存每一步的结果，因此比非链式写法要快。 7. 事件的委托处理（Event Delegation） 大大简化事件的绑定。 8. 少改动DOM结构 （1） 改动DOM结构开销很大，因此不要频繁使用.append()、.insertBefore()和.insetAfter()这样的方法。如果要插入多个元素，就先把它们合并，然后再一次性插入。根据测试，合并插入比不合并插入，快了将近10倍。 （2） 如果你要对一个DOM元素进行大量处理，应该先用.detach()方法，把这个元素从DOM中取出来，处理完毕以后，再重新插回文档。根据测试，使用.detach()方法比不使用时快了60%。 （3） 如果你要在DOM元素上储存数据，不要写成下面这样：elem.data(key,value); 而要写成$.data(elem[0],key,value); （4） 插入html代码的时候，浏览器原生的innterHTML()方法比jQuery对象的html()更快。 9. 正确处理循环 javascript原生循环方法for和while，要比jQuery的.each()方法快，应该优先使用原生方法。 10.尽量少生成jQuery对象 每当你使用一次选择器（比如$('#id')），就会生成一个jQuery对象。jQuery对象是一个很庞大的对象，带有很多属性和方法，会占用不少资源。所以，尽量少生成jQuery对象。 举例来说，许多jQuery方法都有两个版本，一个是供jQuery对象使用的版本，另一个是供jQuery函数使用的版本。由于后一种针对jQuery函数的版本不通过jQuery对象操作，所以相对开销较小，速度比较快。 来源：http://www.ruanyifeng.com/blog/2011/08/jquery_best_practices.html