閑聊jQuery（一）

Write less, do more.

這便是jQuery的宗旨！jQuery，一個高效、精簡並且功能豐富的 JavaScript 工具庫。

想必，對於每一個前端開發者，一定用過jQuery吧！俗話說，學會jQuery，打哪兒都不怕！（瞎說的。。）   jQuery也是我接觸過的第一個JavaScript工具庫。說句心裡話，jQuery用起來確實很爽！下麵分析幾點：

1.原生JavaScript中獲取元素（document.getElementById,document.getElementsByClassName,document.getElementByName...），一寫一大串，寫起來很煩。再看看jQuery中獲取元素（$('id或className或HTML標簽名稱')）。真是方便！

2.jQuery中對ajax進行了封裝，用起來非常順手。

原生ajax：

 1 function success(res) {
 2 //do something
 3 }
 4 
 5 function fail(res) {
 6 //do something
 7 }
 8 
 9 var request = new XMLHttpRequest(); // 新建XMLHttpRequest對象
10 
11 request.onreadystatechange = function () { // 狀態發生變化時，函數被回調
12     if (request.readyState === 4) { // 成功完成
13         // 判斷響應結果:
14         if (request.status === 200) {
15             // 成功，通過responseText拿到響應的文本:
16             return success(request.responseText);
17         } else {
18             // 失敗，根據響應碼判斷失敗原因:
19             return fail(request.status);
20         }
21     } else {
22         // HTTP請求還在繼續...
23     }
24 }
25 
26 // 發送請求:
27 request.open('GET', '/xxx');
28 request.send();
29 
30 alert('請求已發送，請等待響應...');

jQuery ajax：

 1 $.ajax({ 
 2     url: "",    //後臺服務地址
 3     type: "POST" 或 "GET",    //還可以是PUT、DELETE
 4     success: function(){
 5     //do something
 6     }，
 7     error: function() {
 8     //do something
 9     }
10 });    //jQuery ajax還提供了很多可選的屬性，有興趣可以去查看下相關文檔！

3.jQuery提供很多便捷的事件方法。

jQuery事件方法：瀏覽器事件，文檔載入，綁定事件處理器，事件對象，表單事件，鍵盤事件，滑鼠事件。這裡的話，有興趣的話可以查看相關文檔鏈接。

4.jQuery提供了快速實現動畫效果的方法。

只需使用jQuery的一個方法就可以讓你的頁面更加生動！比如：.fadeIn() 、.animate()

jQuery的版本，最新版本jQuery3.2.1 。目前，jQuery共有3代版本，分別是：jQuery1.x.x、jQuery2.x.x、jQuery3.x.x。

這裡註意的是，從jQuery2.x.x開始級以後的版本不再對ie9以下等瀏覽器的支持。官方原話：If you need to support older browsers like Internet Explorer 6-8, Opera 12.1x or Safari 5.1+, use jQuery 1.12.   

jQuery統一了不同瀏覽器之間的DOM操作，使用它，你便可以輕鬆的對頁面進行DOM操作！

後續，我將深入jQuery，學習瞭解這個JavaScript庫是如何實現的，並著手打造一個jQuery插件。    ｃ⌒っ*ﾟ∀ﾟ)ﾒ裝完就跑