## 認識jQuery
jQuery 的理念是:write less,do more。
jQuery 極大的簡化了 javascript 開發人員遍歷HTML文檔、操作 DOM 、處理事件、執行動畫和開發 Ajax 的操作。
### 1.jQuery優勢
1. 輕量級。壓縮后可以保持在30kb左右。
2. 強大的選擇器。可以使用CSS1-CSS3幾乎所有選擇器。
3. 出色的DOM操作的封裝。
4. 可靠的事件處理機制。
5. 完善的Ajax。
6. 不污染頂級變量。jQuery只建立一個名為jQuery的對象,其所有的函數方法都在這個對象之下。
### 2.使用jQuery
jQuery 庫文件一般有生產版和開發版。區別在于生產版經過了壓縮,只有30kb左右,我們下載使用開發版就可以了。
使用時,在頁面引入 jquery.js 庫文件就可以使用了。
~~~javascript
<script type="text/javascript" src="js/jquery.js"></script>
~~~
**簡單編寫jQuery:**
~~~
$(document).ready(function(){
alert('Hello jQuery');
});
~~~
window.onload方法和$(document).ready()方法的區別。
* `window.onload`必須等待網頁中所有內容加在完畢才能執行。
* `$(document).ready()`是網頁中所有DOM結構繪制完成后就執行,可能DOM元素關聯的東西并沒有加載。
**鏈式風格**
~~~
//等待dom元素加載完畢.
$(document).ready(function(){
$(".level1 > a").click(function(){
$(this).addClass("current") //給當前元素添加"current"樣式
.next().show() //下一個元素顯示
.parent().siblings().children("a").removeClass("current") //父元素的兄弟元素的子元素<a>移除"current"樣式
.next().hide(); //它們的下一個元素隱藏
return false;//事件處理阻止了默認的事件行為并停止了事件通過dom向上冒泡
});
});
~~~