jQuery 是什么？

　　jQuery 由 John Resig 創建于 2006 年初，對于任何使用 JavaScript 代碼的程序員來說，它是一個非常有用的 JavaScript 庫。無論您是剛剛接觸 JavaScript 語言，并且希望獲得一個能解決文檔對象模型（Document Object Model，DOM）腳本和 Ajax 開發中一些復雜問題的庫，還是作為一個厭倦了 DOM 腳本和 Ajax 開發中無聊的重復工作的資深 JavaScript 專家，jQuery 都會是您的首選。

　　jQuery 能幫助您保證代碼簡潔易讀。您再也不必編寫大堆重復的循環代碼和 DOM 腳本庫調用了。使用 jQuery，您可以把握問題的要點，并使用盡可能最少的代碼實現您想要的功能。
毫無疑問，jQuery 的原理是獨一無二的：它的目的就是保證代碼簡潔并可重用。當您理解并體會這一原理后，便可以開始學習本教程了，看看 jQuery 對我們的編程方式有多少改進吧。

一些簡單的代碼簡化

　　下面是一個簡單示例，它說明了 jQuery 對代碼的影響。要執行一些真正簡單和常見的任務，比方說為頁面的某一區域中的每個鏈接附加一個單擊（click）事件，您可以使用純 JavaScript 代碼和 DOM 腳本來實現，如 清單 1 所示。

　　清單 1. 沒有使用 jQuery 的 DOM 腳本。

var external_links = document.getElementById('external_links');
var links = external_links.getElementsByTagName('a');
for (var i=0;i < links.length;i++) {
    var link = links.item(i);
    link.onclick = function() {
        return confirm('You are going to visit: ' + this.href);
    };
}

使 Ajax 變得簡單

　　使用 jQuery 將使 Ajax 變得及其簡單。jQuery 提供有一些函數，可以使簡單的工作變得更加簡單，復雜的工作變得不再復雜。
Ajax 最常見的用法就是把一塊 HTML 代碼加載到頁面的某個區域中去。為此，只需簡單地選擇所需的元素，然后使用 load() 函數即可。下面是一個用于更新統計信息的示例：

$('#stats').load('stats.html');

　　為 HTML 添加動畫

　　可以使用 jQuery 處理基本的動畫和顯示效果。animate() 函數是動畫代碼的核心，它用于更改任何隨時間變化的數值型的 CSS 樣式值。比方說，您可以變化高度、寬度、不透明度和位置。還可以指定動畫的速度，定為毫秒或者預定義的速度：慢速，中速或快速。

　　下面是一個同時變化某個元素高度和寬度的示例。請注意，這些參數沒有開始值，只有最終值。開始值取自元素的當前尺寸。同時我也附加了一個回調函數。

$('#grow').animate({ height: 500, width: 500 }, "slow", function(){
    alert('The element is done growing!');
});

　　釋放 jQuery 選擇器的強大能量

　　我們經常會使用 ID 來選擇元素，比如 #myid，或者通過類名，比如 div.myclass 來選擇元素。然而，jQuery 提供了更為復雜和完整的選擇器語法，允許我們在單個選擇器中選擇幾乎所有的元素組合。

　　jQuery 的選擇器語法主要是基于 CSS3 和 XPath 的。對 CSS3 和 XPath 了解的越多，使用 jQuery 時就越加得心應手。有關 jQuery 選擇器的完整列表，包括 CSS 和 XPath，請參閱 參考資料 中的鏈接。

　　CSS3 包含一些并不是所有瀏覽器都支持的語法，因此我們很少使用它。然而，我們仍然可以在 jQuery 中使用 CSS3 選擇元素，因為 jQuery 具備自己的自定義選擇器引擎。比方說，要在表格中的每一個空列中都添加一個橫杠，可以使用：:empty 偽選擇器（pseudo-selector）：

$('td:empty').html('-');

NET技術：使用 jQuery 簡化 Ajax 開發，轉載需保留來源！

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。