有效提高 jQuery 代码效率的25个技巧_H5之家 - 中国HTML5教程资源分享第一站

jQuery是一款非常优秀的JavaScript框架，关于它的更多介绍请点这里。今天烈火小编整理了些提高jQuery效率的小技巧发给大家，希望对各位朋友有所帮助。

1. 从Google Code加载jQuery

Google Code上已经托管了多种JavaScript类库，从Google Code上加载jQuery比直接从你的服务器加载更有优势。它节省了你服务器上的带宽，能够很快的从Google的内容分布网络(CDN)上加载JS类库。更重要的是，如果用户访问那些发布在Google Code上的站点后它会被缓存下来。

这样做很有意义。有多少站点使用了没有被缓存的相同jQuery副本，而这些很容易做到:

// Load jQuery

google.load("jquery", "1.2.6");

google.setOnLoadCallback(function() {

// Your code goes here.

});

</script>

// Load jQuery

google.load("jquery", "1.2.6");

google.setOnLoadCallback(function() {

// Your code goes here.

});

</script>

或者，你能够直接引用JS:

script src="" type="text/javascript"></script>
<script src="" type="text/javascript"></script>

这里有详细的用法说明

2. 使用备忘单
不仅仅是jQuery，很多编程语言也有类似的备忘单，在一张A4的纸上就可以很容易看到每个函数的用法。幸运的是已经有好心的家伙把jQuery的备忘单做得很完善了：

【译注】
jQuery 1.3 Cheat Sheet

3. 整合所有的脚本并缩减它们

不错，这是JavaScript的一个常见技巧。可是一个使用了jQuery的大项目可能使用了很多相关的jQuery插件(本站就使用了easing,localScroll,lightbox,preload)，因此它通常是适用的。浏览器不能同时加载JS脚本（大多数情况下），这意味着如果你同一时间加载很多脚本的话，将减缓页面的加载速度。因此，如果每个页面都要加载这些脚本，你应该考虑在发布之前将这些脚本整合成一个稍大的JS脚本。一些jQuery插件已经最小化了，但是你应该打包你的JS脚本和那些没有缩减过的脚本，这仅需要几秒的时间就可以完成。

就个人而言，我推荐Packer by Dean Edwards

4. 使用Firebug出色的控制台日志工具
如果你还没有安装Firebug，那么你真的应该把它装上。除了许多其它有用的特性（比如允许你检查http传输情况、发现你的CSS问题），它也有极好的日志命令，允许你很容易调试JS脚本。
这里有Firebug所有特性的详细说明。
我最喜欢的特性有”console.info“，通过它你可以把信息和变量值输出到控制台上，而不必使用alert；”console.time”则允许你在一组代码上设置定时器，从而计算出JS脚本运行所花费的时间。这一切都很容易做到:

console.time('create list');

for (i = 0; i < 1000; i++) {
var myList = $('.myList');
myList.append('This is list item ' + i);
}

console.timeEnd('create list');