每個版本又分為一下兩種:開發版和生產版:
版本 大小/KB 描述
jquery-1.x.js 約288 開發版,完整無壓縮,多用於學習,開發和測試
jquery-2.x.js 約251 開發版,完整無壓縮,多用於學習,開發和測試
jquery-1.x.min.js 約94 生產版,經過壓縮工具壓縮,體積相對比較小,主要勇於產品和項目中
jquery-2.x.min.js 約83 生產版,經過壓縮工具壓縮,體積相對比較小,主要勇於產品和項目中
在頁面中使用jQuery分為兩步:首先引入jQuery庫,然后使用jQuery實現界面操作。
項目1引入jQuery庫
jQuery不需要安裝,只需要將下載的jQuery庫放到站點的一個公共目錄中,然后在頁面中通過 < script > 標簽引入即可。
<script type="text/javascipt" src="js/jquery-1.x.js"></script>
1
jQuery簡單測試
在頁面中引入jQuery庫后,通過$ ()函數來獲取頁面中的元素,並對元素進行定位或效果處理。在沒有特別說明的情況下,$ 符號即為jQuery對象的縮寫形式,例如$(“myDiv”)與jQuery(“myDiv”)完全等價。
<!doctype html>
<head>
<meta charset="utf-8">
<title>測試示例</title>
<script type="text/javascipt" src="js/jquery-1.x.js"></script>
</head>
<body>
<div id="myDiv"> Hello World!</div>
<script type="text/javascript">
$(document).ready(fucntion(e){
//alert(jQuery("#myDiv").html());
alert($("#myDiv").html());
});
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
上述代碼中,通過jQuery讀取< div>標簽中的內容,$(document).ready()方法的作用類似於JavaScript中window.onload事件,但也有一定區別:
區別項 window.onload $(document).ready()
執行時間 必須在頁面全部加載完成(包含圖片下載)后才能執行 在頁面中所有DOM結構下載完畢后執行,此時可能DOM元素關聯的內容並沒有加載完畢
執行次數 一個頁面只能有一個,當頁面中存在多喝window.onload時,僅輸出最后一個的結果明晚發完成多個結果同時輸出 一個頁面可以有多個,結果可以相繼輸出
簡化寫法 無 可以簡寫成$(http://www.my516.com)
---------------------