雖然項目中用戶jQuery,但是對其瞭解還是很片段，趁着雙11的大風，買本書:jQuery權威指南第二版，準備邊學習邊記筆記，形成自己對jQuery 比較全面的理解。
還是從hello World開始。
1、認識jQuery
1.1 jQuery的基本功能
一、訪問和操作DOM元素二、控制頁面樣式
三、對頁面事件的處理
四、大量插件在頁面中的應用
五、與ajax技術的完美結合
2、搭建jQuery開發環境
2.1 下載jQuery文件庫
下載地址：http://jquery.com
2013年11月12日的最新版本爲：jQuery 1.10.2+jQuery 2.0.3
原來jquery的版本也是分爲新老版本，1.X + 2.X
jQuery 1.x
The jQuery 1.x line had major changes as of jQuery 1.9.0. We strongly recommend that you also use the jQuery Migrate plugin if you are upgrading from pre-1.9 versions of jQuery or need to use plugins that haven't yet been updated.
jQuery 2.x【原來不支持老版本IE了】
jQuery 2.x has the same API as jQuery 1.x, but does not support Internet Explorer 6, 7, or 8. All the notes in the jQuery 1.9 Upgrade Guide apply here as well. Since IE 6/7/8 are still relatively common, we recommend using the 1.x version unless you are certain no IE 6/7/8 users are visiting the site. Please read the 2.0 release notes carefully.
2.2 引入jQuery文件庫
<script language="javascript" type="text/javascript"
src="js/jquery-2.0.3.js"></script>2.3第一個例子
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>第一個簡單的jQuery程序</title>
<script language="javascript" type="text/javascript"
src="js/jquery-2.0.3.js"></script>
<style type="text/css">
div{padding:8px opx;font-size:12px; text-align:center;border:solid 1px #888;}
</style>
<script type="text/javascript" >
$(document).ready(function(){
$("div").html(" 您好！歡迎來到 jQuery 的精彩世界")
});
</script>
</head>
<body>
<div></div>
</body>
</html>3、jQuery簡單應用
3.1 jQuery訪問DOM對象
javascript 和jQuery兩種方式訪問DOM對象的比較，簡單明瞭:
例如：頁面有兩個div元素：
<div id="Tmp">測試文本</div>
<div id="Out"></div>
| javascript方式 | jQuery方式 |
| var tDiv = document.getElementById("Tmp");var oDiv = document.getElementById("Out"); var cDiv = tDiv.innerHTML; oDiv.innerHTML = cDiv; |
var tDiv = $("#Tmp");var oDiv =$("#Out"); var cDiv = tDiv.html(); oDiv.html( cDiv) |