|
一、簡(jiǎn)介
1.1、概述
隨著WEB2.0及ajax思想在互聯(lián)網(wǎng)上的快速發(fā)展傳播,陸續(xù)出現(xiàn)了一些優(yōu)秀的Js框架,其中比較著名的有Prototype、YUI、jQuery、mootools、Bindows以及國(guó)內(nèi)的JSVM框架等,通過(guò)將這些JS框架應(yīng)用到我們的項(xiàng)目中能夠使程序員從設(shè)計(jì)和書寫繁雜的JS應(yīng)用中解脫出來(lái),將關(guān)注點(diǎn)轉(zhuǎn)向功能需求而非實(shí)現(xiàn)細(xì)節(jié)上,從而提高項(xiàng)目的開(kāi)發(fā)速度。
jQuery是繼prototype之后的又一個(gè)優(yōu)秀的Javascript框架。它是由 John Resig 于 2006 年初創(chuàng)建的,它有助于簡(jiǎn)化JavaScript™ 以及Ajax編程。有人使用這樣的一比喻來(lái)比較prototype和jQuery:prototype就像Java,而jQuery就像ruby.它是一個(gè)簡(jiǎn)潔快速靈活的JavaScript框架,它能讓你在你的網(wǎng)頁(yè)上簡(jiǎn)單的操作文檔、處理事件、實(shí)現(xiàn)特效并為Web頁(yè)面添加Ajax交互。
它具有如下一些特點(diǎn):
1、代碼簡(jiǎn)練、語(yǔ)義易懂、學(xué)習(xí)快速、文檔豐富。
2、jQuery是一個(gè)輕量級(jí)的腳本,其代碼非常小巧,最新版的JavaScript包只有20K左右。
3、jQuery支持CSS1-CSS3,以及基本的xPath。
4、jQuery是跨瀏覽器的,它支持的瀏覽器包括IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+。
5、可以很容易的為jQuery擴(kuò)展其他功能。
6、能將JS代碼和HTML代碼完全分離,便于代碼和維護(hù)和修改。
7、插件豐富,除了jQuery本身帶有的一些特效外,可以通過(guò)插件實(shí)現(xiàn)更多功能,如表單驗(yàn)證、tab導(dǎo)航、拖放效果、表格排序、DataGrid,樹(shù)形菜單、圖像特效以及ajax上傳等。
jQuery的設(shè)計(jì)會(huì)改變你寫JavaScript代碼的方式,降低你學(xué)習(xí)使用JS操作網(wǎng)頁(yè)的復(fù)雜度,提高網(wǎng)頁(yè)JS開(kāi)發(fā)效率,無(wú)論對(duì)于js初學(xué)者還是資深專家,jQuery都將是您的首選。
jQuery適合于設(shè)計(jì)師、開(kāi)發(fā)者以及那些還好者,同樣適合用于商業(yè)開(kāi)發(fā),可以說(shuō)jQuery適合任何JavaScript應(yīng)用的地方,可用于不同的Web應(yīng)用程序中。
官方站點(diǎn):http://jquery.com/ 中文站點(diǎn):http://jquery.org.cn/
1.2、目的
通過(guò)學(xué)習(xí)本文檔,能夠?qū)Query有一個(gè)簡(jiǎn)單的認(rèn)識(shí)了解,清楚JQuery與其他JS框架的不同,掌握jQuery的常用語(yǔ)法、使用技巧及注意事項(xiàng)。
二、使用方法
在需要使用JQuery的頁(yè)面中引入JQuery的js文件即可。
例如:<script type="text/Javascript" src="js/jquery.js"></script>
引入之后便可在頁(yè)面的任意地方使用jQuery提供的語(yǔ)法。
三、學(xué)習(xí)教程及參考資料
請(qǐng)參照《jQuery中文API手冊(cè)》和http://jquery.org.cn/visual/cn/index.xml
推薦兩篇不錯(cuò)的jquery教程:《jQuery的起點(diǎn)教程》和《使用 jQuery 簡(jiǎn)化 Ajax 開(kāi)發(fā)》
(說(shuō)明:以上文檔都放在了【附件】中)
四、語(yǔ)法總結(jié)和注意事項(xiàng)
1、關(guān)于頁(yè)面元素的引用
通過(guò)jquery的$()引用元素包括通過(guò)id、class、元素名以及元素的層級(jí)關(guān)系及dom或者xpath條件等方法,且返回的對(duì)象為jquery對(duì)象(集合對(duì)象),不能直接調(diào)用dom定義的方法。
2、jQuery對(duì)象與dom對(duì)象的轉(zhuǎn)換
只有jquery對(duì)象才能使用jquery定義的方法。注意dom對(duì)象和jquery對(duì)象是有區(qū)別的,調(diào)用方法時(shí)要注意操作的是dom對(duì)象還是jquery對(duì)象。
普通的dom對(duì)象一般可以通過(guò)$()轉(zhuǎn)換成jquery對(duì)象。
如:$(document.getElementById("msg"))則為jquery對(duì)象,可以使用jquery的方法。
由于jquery對(duì)象本身是一個(gè)集合。所以如果jquery對(duì)象要轉(zhuǎn)換為dom對(duì)象則必須取出其中的某一項(xiàng),一般可通過(guò)索引取出。
如:$("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5]這些都是dom對(duì)象,可以使用dom中的方法,但不能再使用Jquery的方法。
以下幾種寫法都是正確的:
$("#msg").html();
$("#msg")[0].innerHTML;
$("#msg").eq(0)[0].innerHTML;
$("#msg").get(0).innerHTML;
it知識(shí)庫(kù):jQuery技巧總結(jié),轉(zhuǎn)載需保留來(lái)源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除,多謝。