[通译]25招改善你的jQuery - [2]

[翻译]25招改善你的jQuery - [2]

目录

? 1. 从Google Code加载jQuery
? 2. 使用备忘单
? 3. 整合所有的脚本并缩减它们
? 4. 使用Firebug出色的控制台日志工具
? 5. 通过缓存最小化选择操作
? 6. 最小化DOM操作
? 7. 处理DOM插入操作时，将需要的内容包装在一个元素中
? 8. 尽可能使用IDs而不是classes
? 9. 给选择器提供上下文
10. 正确使用方法链
11. 学会正确使用效果
12. 了解事件代理
13. 利用classes存储状态
14. 更好的方法是利用jQuery内置的data()方法存储状态
15. 写你自己的选择器
16. 精简你的HTML并在页面加载后修改它
17. 为了速度和SEO方面的考虑，延迟加载内容
18. 使用jQuery提供的工具函数
19. 使用noConflict重命名jQuery对象
20. 如何得知图片已加载完毕
21. 总是使用最新版本
22. 如何检查元素是否存在
23. 给你的HTML属性增加JS类
24. 返回'false'以防止默认行为
25. ready事件的简写

16. 精简你的HTML并在页面加载后修改它

这个标题可能没有多大意思，但是这个技巧可能理顺你的代码、减小代码体积和页面的下载时间、有助优化你的搜索引擎。请看下面的例子：

上面是一个HTML的具体例子，为了解释目的做了少量修改。我相信你也会认为这段代码相当的丑陋。如果类似代码很长的话，你最终会形成一个相当长且丑陋的页面。因此你可以像下面这样处理它：
这样做并不总是可取的，在页面加载后的一瞬间你将会看到页面的闪动，但是在特定情况下你有很多重复的HTML内容，这时通过这个方法你可以显著的减小页面代码体积，减少无关且重复的标记能使你的SEO从中受益。 
17. 为了速度和SEO方面的考虑，延迟加载内容
另外还有一个方法可以提升页面加载速度，理顺Spiders搜索的HTML内容，通过在页面加载之后使用AJAX请求晚加载其他内容，这样用户就可以马上开始浏览，让Spider看到你想要它们进行索引的内容。
我们已经在自己的网站上使用了这个技术。本页面上部的紫色按钮会弹出三个表格，方位与Google地图，这会使我们页面大小增加两倍。因此我们仅需要把这些HTML内容放入一个静态页面中，在页面加载完成之后通过load()函数加载它：
然后添加上如下的事件处理：
$('popup').click(function(){       // Launch popup code   });  
你在长页面使用上述方法时，它可能可以正常工作。有些时候你会注意到在点击链接后锚点会跳转到页面上部。
所有你要做的就是阻止它的默认行为，或者实际上你可以把"return false;"添加到任何事件的默认行为上。像这样：
$('popup').click(function(){       // Launch popup code       return false;   }); 
?
25. ready事件的简写
一个小技巧但是通过使用$(document).ready()的简写，你可以少输入几个字符。
取代：
$(document).ready(function (){       // your code   });  
你可以简写成：
$(function (){       // your code   });  
如果你喜欢这篇文章，请digg一下。?
【译注】
翻译完毕！