12. 設置全局AJAX為缺省
如果你開發(fā)ajax程序的話，你肯定需要有”加載中“之類的顯示告知用戶，ajax正在進行，我們可以使用如下代碼統(tǒng)一管理，如下：
// ajaxSetup is useful for setting general defaults:
$.ajaxSetup({
url : '/ajax/',
dataType : 'json'
});
$.ajaxStart(function(){
showIndicator();
disableButtons();
});
$.ajaxComplete(function(){
hideIndicator();
enableButtons();
});
/*
// Additional methods you can use:
$.ajaxStop();
$.ajaxError();
$.ajaxSuccess();
$.ajaxSend();
*/
詳細你可以查看這篇文章:
* 如何快速創(chuàng)建一個AJAX的"加載"的圖片效果
* 5個在線Ajax“加載中”旋轉圖標生成器工具
13. 在動畫中使用delay()方法
鏈式的動畫效果是jQuery的強大之處。但是有一個忽略了的細節(jié)就是你可以在動畫之間加上delays，如下：
// This is wrong:
$('#elem').animate({width:200},function(){
setTimeout(function(){
$('#elem').animate({marginTop:100});
},2000);
});
// Do it like this:
$('#elem').animate({width:200}).delay(2000).animate({marginTop:100});
jQuery動畫幫了我們大忙，否則我們得自己處理一堆的細節(jié)，設置timtout，處理屬性值，跟蹤動畫變化等等。
大家可以參考這個文章：jQuery animations
14. 合理利用HTML5的Data屬性
HTML5的data屬性可以幫助我們插入數據。特別合適前后端的數據交換。jQuery近來發(fā)布的data()方法，可以有效的利用HTML5的屬性，來自動得到數據。下面是個例子：
<div id="d1" data-role="page" data-last-value="43" data-hidden="true"
data-options='{"name":"John"}'>
</div>
為了存取數據你需要調用如下代碼：
$("#d1").data("role"); // "page"
$("#d1").data("lastValue"); // 43
$("#d1").data("hidden"); // true;
$("#d1").data("options").name; // "John";
如果你想看看實際的例子，請參考這篇教程：使用HTML5和jQuery插件Quicksand實現一個超酷的星際爭霸2兵種分類展示效果
data()的jQuery文檔：data() in the jQuery docs
15. 本地存儲和jQuery
本地存儲是一個超級簡單的API。簡單的添加你的數據到localStorage全局屬性中:
localStorage.someData = "This is going to be saved across page refreshes and browser restarts";
但是對于老的瀏覽器來說，這個不是個好消息。因為他們不支持。但是我們可以使用jQuery的插件來提供支持一旦本地存儲不能用的話。這種方式可以使得本地存儲功能正常工作。