使用jQuery簡(jiǎn)化Ajax開發(fā)——Ajax開發(fā)入門

《使用jQuery簡(jiǎn)化Ajax開發(fā)——Ajax開發(fā)入門》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在工程資料-天天文庫。

1、使用jQuery簡(jiǎn)化Ajax開發(fā)——Ajax開發(fā)入門jQuery是一個(gè)可以簡(jiǎn)化JavaScript?以及AJAX（AsynchronousJavaScript+XML，異步Javascript和XML）編程的Javascript庫。不同于其他的Javascript庫，jQuery有他自己的哲學(xué)，使你可以很簡(jiǎn)單的編寫代碼。這篇文章就會(huì)帶領(lǐng)你見識(shí)一下jQuery的哲學(xué)，探討一下他的特性以及功能，并且會(huì)做一些ajax的示例，以及如何使用plug-in（插件）來擴(kuò)展jQuery。1.什么是jQuery？

2、jQuery是個(gè)很優(yōu)秀的Javascript庫，它誕生于2006年，出自JohnResig之手。不管你是一個(gè)javascript新手，但是卻想嘗試一下DOM（DocumentObjectModel）以及Ajax的繁雜，抑或你是個(gè)javascript專家級(jí)人物，但是已經(jīng)厭倦了反復(fù)的重復(fù)那無味的DOM以及Ajax腳本，jQuery都將是你的不二選擇。jQuery會(huì)幫助你保持代碼的簡(jiǎn)單和簡(jiǎn)潔。你不必再去寫一大堆重復(fù)的循環(huán)或者是DOM調(diào)用腳本，使用jQuery，你將很快找到關(guān)鍵點(diǎn)，并且可以以最少的代碼表

3、達(dá)你的思想。jQuery的哲學(xué)其實(shí)很單一：簡(jiǎn)單、可重用。當(dāng)你理解并且認(rèn)同這種思想的時(shí)候，你就可以開始體會(huì)一下使用jQuery能讓你的編程變得多么輕松愉快了！2.一些簡(jiǎn)單概念這里是個(gè)簡(jiǎn)單的例子，向你展示jQuery如何影響你編寫的代碼。做的事情其實(shí)很簡(jiǎn)單，比如對(duì)頁面上某一區(qū)域內(nèi)的所有鏈接都添加一個(gè)click響應(yīng)事件，你可以使用一般的Javascript以及DOM來寫，代碼見Listing1：Listing1.DOMscriptingwithoutjQueryvarexternal_links=do

4、cument.getElementById('external_links');varlinks=external_links.getElementsByTagName('a');for(vari=0;i

5、ptingwithjQuery$('#external_linksa').click(function(){returnconfirm('Youaregoingtovisit:'+this.href);});很驚訝，是吧？使用jQuery的話，你可以很快找到關(guān)鍵點(diǎn)，并且只需要表達(dá)你需要表達(dá)的，而不需要羅里羅嗦。不需要對(duì)這些元素進(jìn)行循環(huán)，click()函數(shù)可以處理好這一切。而且你不要謝太多的操作DOM的代碼，你需要的僅僅是使用很少的字符定義你要找的那個(gè)元素。來看一下這段代碼是如何工作的，有點(diǎn)小技巧

6、。首先，看到$()函數(shù)--jQuery里最有用的最強(qiáng)大的函數(shù).大部分情況下,你使用這個(gè)函數(shù)從文檔中選擇元素.在這個(gè)例子中,使用這個(gè)函數(shù)傳遞帶有一些級(jí)聯(lián)樣式表(CascadingStyleSheets,CSS)語法的字符串,jQuery可以很方便的找到這個(gè)元素.如果你懂一點(diǎn)基本的CSS選擇符的只是,我想這個(gè)語法應(yīng)該看起來相當(dāng)熟悉.在Listing2中,#external_links用來尋找?guī)в衖d為external_links的元素.接下來的空格表示jQuery要找到在#external_link

7、s元素內(nèi)的所有的元素.用口語開表達(dá)的話有點(diǎn)費(fèi)勁--用DOM腳本來寫也挺麻煩,不過,在CSS里,沒有比這個(gè)更簡(jiǎn)單的了.$()函數(shù)返回一個(gè)包含與css選擇符匹配的所有元素的一個(gè)jQuery對(duì)象.jQuery對(duì)象的概念就像是數(shù)組,但是它可能含有許多jQuery函數(shù).舉例來說,你可以調(diào)用click函數(shù)來綁定一個(gè)click事件響應(yīng)到j(luò)Query對(duì)象中的每個(gè)元素上.你還可以向$()函數(shù)傳遞一個(gè)元素或者是元素的數(shù)組,它將把所有的元素打包成一個(gè)jQuery對(duì)象.你可能想要把這一特性應(yīng)用到象窗口對(duì)象上面.舉

8、例來說,你有可能使用此函數(shù)來加載事件,像這樣:window.onload=function(){//dothisstuffwhenthepageisdoneloading};如果使用jQuery的話,你可以這樣寫:$(window).load(function(){//runthiswhenthewholepagehasbeendownloaded});如你所知,等待一個(gè)窗口的加載是異常痛苦的,因?yàn)楸仨毤虞d整個(gè)頁面,包括頁面上所有的圖片.某些情況下,你需要首先加載圖片,但是大部分時(shí)候,你可能只需