因?yàn)轫?xiàng)目需要，同時(shí)也因?yàn)榕d趣，在近一段時(shí)間研究和使用了jQuery，它真的是太強(qiáng)大了，代碼非常的優(yōu)雅和簡潔，好后悔現(xiàn)在才開始了解它，雖然目前網(wǎng)絡(luò)上關(guān)于jQuery的資料、學(xué)習(xí)心得，教程多得你看不完，但我還是想把自己的一點(diǎn)學(xué)習(xí)經(jīng)驗(yàn)寫下來，不管是提供給那些想學(xué)習(xí)jQuery的人，還是保留一份學(xué)習(xí)筆記，我覺得這都是很有必要的。
在說jQuery之前，不得不提下現(xiàn)在也非常流行的mootools框架。在網(wǎng)上，很多人把mootools比作java，把jquery比作perl。我沒研究過mootools，也不發(fā)表意見，這完全沒有意義。只要本身不存在重大缺陷就可以了。用好了都強(qiáng)大。好比Java和.NET爭論了這么多年，一樣的道理。
jQuery，顧名思義，也就是JavaScript和查詢（Query），即是輔助開發(fā)的庫。是繼prototype之后又一個(gè)優(yōu)秀的JavaScript框架。它如暴風(fēng)雪般席卷WEB前端開發(fā)，jQuery已確定成為ASP.NET MVC和Visual Studio 2008版本中的正式組成部分，諾基亞手機(jī)平臺(tái)Web Run-Time也將納入jQuery。所以，請(qǐng)相信，選擇jQuery是不會(huì)錯(cuò)的。如果你看到這里還有猶豫，那么我再說個(gè)理由，應(yīng)該能打消你的最后疑慮了。2009年12月份Tiobe編程語言排行榜JavaScript升到第8名，并且在上升勢頭最強(qiáng)勁的語言中排名第3位。我在這里不是想說排行榜的話題，因?yàn)槟怯謺?huì)引發(fā)一場說不完的爭論。我的意思是，排行榜不能說明一切問題，但至少能夠說明，現(xiàn)在用哪種語言的人多，人多則說明有活力，相應(yīng)的其它各種資源也會(huì)較豐富。JavaScript腳本已經(jīng)深入WEB應(yīng)用之中。而作為優(yōu)秀的JavaScript框架，它的前景不用懷疑。除非出現(xiàn)一個(gè)比jQuery更牛B，更優(yōu)秀的東東。
我不打算像寫教程那樣，把jQuery的基礎(chǔ)用法都羅列出來，那會(huì)很無趣，也沒意義。網(wǎng)上這方面的知識(shí)隨便搜一下就一大堆。我準(zhǔn)備從項(xiàng)目的角度出發(fā)，寫出自己的感受。當(dāng)然，一份API幫助文檔是必不可少的，在最末尾提供了jQuery-1.2.6.chm下載，需者自取。
首先我們要知道，JavaScript開發(fā)基本可以分為以下四個(gè)部分：
1、查找DOM元素進(jìn)行取值和賦值的操作、在特定節(jié)點(diǎn)位置進(jìn)行內(nèi)容的取值和賦值操作（innerHTML）。
2、針對(duì)元素進(jìn)行事件監(jiān)聽。
3、通過操作DOM節(jié)點(diǎn)結(jié)合改變?cè)氐腃SS樣式，達(dá)到絢麗的動(dòng)畫效果。
4、對(duì)DOM元素進(jìn)行Ajax操作。
對(duì)于jQuery來說，可以對(duì)這四部分提供完美的實(shí)現(xiàn)：
a、jQuery擁有強(qiáng)大的選擇器，可以查找任意的DOM元素。同時(shí)jQuery對(duì)象實(shí)現(xiàn)鏈?zhǔn)秸Z法，能夠很方便簡潔的寫出強(qiáng)大的操作。比如操作屬性：$("#chkbox").attr("checked","checked").attr("disabled","disabled")。可以這樣繼續(xù)鏈下去，包括增加事件、樣式等等操作。
b、在頁面加載時(shí)給DOM綁定事件。$("#chkbox").click(function(){ alert("hello jquery!"); });
c、show()和hide()是jQuery中最基本的動(dòng)畫。對(duì)元素顯示和隱藏，當(dāng)然，我們還可以實(shí)現(xiàn)其它的更復(fù)雜的動(dòng)畫。
d、$.ajax(options)是jQuery中最底層的Ajax實(shí)現(xiàn)。除此之外，還可以使用$.get()或$.post()實(shí)現(xiàn)Ajax請(qǐng)求。
了解了以上內(nèi)容后，jQuery帶給我們的另一個(gè)驚喜，在于它的API支持當(dāng)前多種主流瀏覽器，使得你不用再為了IE、FireFox等兼容問題而抓頭發(fā)傷腦筋。在以前做項(xiàng)目的時(shí)候，我總是喜歡將行為或樣式屬性寫在DOM中。這是極其不好也極其不規(guī)范的一種做法。如今采用jQuery后，我將所有的行為全部從DOM中抽取了出來，放到jQuery初始化函數(shù)中進(jìn)行綁定。而且jQuery的初始化函數(shù)比window.onload的加載速度更快。
$(function(){
$("#chkbox").click(
function(){
alert("hello jQuery!");
}
);
});
<input type="checkbox" id="chkbox"/>
上面是一種簡寫方法，不管是初始化函數(shù)還是綁定事件。推薦采用這種寫法。
※下面這種寫法是不可取的，行為一定要和DOM分離：
function chkClick(){
alert("hello jQuery");
}
<input type="checkbox" id="chkbox" onclick="chkClick()"/>
※不要再把樣式寫到DOM里面，這是很難維護(hù)的一件事情：
<span style="font-size:15pt;color:red">hello jQuery</span>
應(yīng)該統(tǒng)一采用CSS文件定義或是定義class類，或是對(duì)ID進(jìn)行定義：
.spanClass{
font-size:15pt;
color:red;
}
<span class="spanClass">hello jQuery</span>
#hello_span{
font-size:15pt;
color:red;
}
<span id="hello_span">hello jQuery</span>
是否對(duì)jQuery有了一些認(rèn)識(shí)呢？下次我們繼續(xù)討論。 點(diǎn)擊下載： jQuery-1.2.6.chm
本文為菠蘿大象原創(chuàng)，如要轉(zhuǎn)載請(qǐng)注明出處。
posted on 2010-02-13 00:45
菠蘿大象 閱讀(3881)
評(píng)論(3) 編輯 收藏 所屬分類:
jQuery