JavaScript-26-設(shè)計模式和jQuery入門_第1頁
JavaScript-26-設(shè)計模式和jQuery入門_第2頁
JavaScript-26-設(shè)計模式和jQuery入門_第3頁
JavaScript-26-設(shè)計模式和jQuery入門_第4頁
JavaScript-26-設(shè)計模式和jQuery入門_第5頁
已閱讀5頁,還剩3頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

設(shè)計模式:設(shè)計模式〔Designpattern〕是一套被反復(fù)使用、多數(shù)人知曉的、經(jīng)過分類編目的、代碼設(shè)計經(jīng)驗的總結(jié)。使用設(shè)計模式是為了可重用代碼、讓代碼更容易被他人理解、保證代碼可靠性,增加可維護(hù)性。1:單例模式意圖:保證一個類僅有一個實例,并提供一個訪問它的全局訪問點。2:代理模式意圖:為其他對象提供一種代理以控制對這個對象的訪問。代理模式的作用,在于執(zhí)行目標(biāo)函數(shù)之前,可以先做一些其他的相關(guān)操作。在下面的例子中,地圖效勞就是一個代理,它跟目標(biāo)函數(shù)一樣提供了計算航線的功能。但是,它使用了緩存技術(shù)來提供數(shù)據(jù)。這樣做目的很簡單,就是在不修改目標(biāo)函數(shù)的前提下,增強功能。3:適配器模式意圖:將一個類的接口轉(zhuǎn)換成另外一個客戶希望的接口。Adapter模式使得原本由于接口不兼容而不能一起工作的那些類可以一起工作。應(yīng)用: 1:使用單例模式封裝信息提示框插件。1:jQuery簡介:jQuery是一個兼容多瀏覽器的javascript庫,核心理念是writeless,domore(寫得更少,做得更多)。今天,jQuery已經(jīng)成為最流行的javascript庫,在世界前10000個訪問最多的網(wǎng)站中,有超過55%在使用jQuery。jQuery,顧名思義,也就是JavaScript和查詢〔Query〕,jQuery是免費、開源的。它可以簡化查詢DOM對象、處理事件、制作動畫、處理Ajax交互過程。jQuery優(yōu)勢:1:體積小,使用靈巧〔只需引入一個js文件〕。2:方便的選擇頁面元素〔模仿CSS選擇器更精確、靈活〕。3:動態(tài)更改頁面樣式/頁面內(nèi)容〔操作DOM,動態(tài)添加、移除樣式〕。4:控制響應(yīng)事件〔動態(tài)添加響應(yīng)事件〕。5:提供根本網(wǎng)頁特效〔提供已封裝的網(wǎng)頁特效方法〕。6:快速實現(xiàn)通信〔ajax〕。7:易擴展、插件豐富。8:支持鏈?zhǔn)綄懛?。引入jQuery:1:通過script引入本地jQuery文件。2:通過引入CDN上面jQuery文件。版本選擇:1.x:兼容ie678,使用最為廣泛的,官方只做BUG維護(hù),功能不再新增。因此一般工程來說,使用1.x版本就可以了,最終版本:1.12.4(2023年5月20日)2.x:不兼容ie678,很少有人使用,官方只做BUG維護(hù),功能不再新增。如果不考慮兼容低版本的瀏覽器可以使用2.x,最終版本:2.2.4(2023年5月20日)3.x:不兼容ie678,只支持最新的瀏覽器。除非特殊要求,一般不會使用3.x版本的,很多老的jQuery插件不支持這個版本。目前該版本是官方主要更新維護(hù)的版本。jQuery和$的關(guān)系:2:選擇器ID選擇器$(“#box〞);類名選擇器:$(“.box〞);標(biāo)簽選擇器:$(“div〞);后代選擇器:$(“#boxp〞);:first:獲取第一個元素。:last:獲取最后一個元素。:even:匹配所有索引值為偶數(shù)的元素,從0開始計數(shù)。:odd:匹配所有索引值為奇數(shù)的元素,從0開始計數(shù)。:eq(index):匹配一個給定索引值的元素,從0開始計數(shù)。:not(selector):去除所有與給定選擇器匹配的元素。:has(selector):匹配含有選擇器所匹配的元素的元素。3:屬性和CSS操作屬性:attr(name|properties|key,value|fn):設(shè)置或返回被選元素的屬性值。removeAttr(name):從每一個匹配的元素中刪除一個屬性。prop(name|properties|key,value|fn):獲取在匹配的元素集中的第一個元素的屬性值。removeProp(name):用來刪除由.prop()方法設(shè)置的屬性集。區(qū)別:attr可以操作〔增刪改查〕自定義的節(jié)點屬性,而prop不可以〔增刪改查〕。attr和prop對input的disabled屬性的返回值不一致,attr返回disabled或者undefined,而prop返回布爾值。操作Class:addClass(class|fn):為每個匹配的元素添加指定的類名。removeClass([class|fn]):從所有匹配的元素中刪除全部或者指定的類。toggleClass(class|fn[,switch]):如果存在〔不存在〕就刪除〔添加〕一個類。操作內(nèi)容:html([val|fn]):取得第一個匹配元素的html內(nèi)容。這個函數(shù)不能用于XML文檔。但可以用于XHTML文檔。text([val|fn]):取得所有匹配元素的內(nèi)容。結(jié)果是由所有匹配元素包含的文本內(nèi)容組合起來的文本。這個方法對HTML和XML文檔都有效。val([val|fn|arr]):獲得匹配元素的當(dāng)前值。如果多項選擇,將返回一個數(shù)組,其包含所選的值。操作CSS:css(name|pro|[,val|fn]):訪問匹配元素的樣式屬性。操作位置:offset([coordinates]):獲取匹配元素在當(dāng)前視口的相對偏移。返回的對象包含兩個整型屬性:top和left,以像素計。方法只對可見元素有效。position():獲取匹配元素相對父元素的偏移。返回的對象包含兩個整型屬性:top和left。為精確計算結(jié)果,請在補白、邊框和填充屬性上使用像素單位。此方法只對可見元素有效。scrollTop([val]):獲取匹配元素相對滾動條頂部的偏移。此方法對可見和隱藏元素均有效。scrollLeft([val]):獲取匹配元素相對滾動條左側(cè)的偏移。此方法對可見和隱藏元素均有效。操作尺寸:height([val|fn]):取得匹配元素當(dāng)前計算的高度值〔px〕。width([val|fn]):取得第一個匹配元素當(dāng)前計算的寬度值〔px〕。innerHeight():獲取第一個匹配元素內(nèi)部區(qū)域高度〔包括補白、不包括邊框〕。此方法對可見和隱藏元素均有效。innerWidth():獲取第一個匹配元素內(nèi)部區(qū)域?qū)挾取舶ㄑa白、不包括邊框〕。此方法對可見和隱藏元素均有效。outerHeight([options]):獲取第一個匹配元素外部高度〔默認(rèn)包括補白和邊框〕。此方法對可見和隱藏元素均有效。outerWidth([options]):獲取第一個匹配元素外部寬度〔默認(rèn)包括補白和邊框〕。此方法對可見和隱藏元素均有效。注:設(shè)置options為true,計算margin在內(nèi)。4:過濾查找過濾元素:eq(index|-index):獲取第N個元素。這個元素的位置是從0算起,如果是負(fù)數(shù),那么從集合中的最后一個元素開始倒數(shù)。first():獲取第一個元素。last():獲取最后一個元素。hasClass(class):檢查當(dāng)前的元素是否含有某個特定的類,如果有,那么返回true。has(expr|ele):保存包含特定后代的元素,去掉那些不含有指定后代的元素。not(expr|ele|fn):刪除與指定表達(dá)式匹配的元素。查找元素:children([expr]):取得一個包含匹配的元素集合中每一個元素的所有子元素的元素集合。只考慮子元素而不考慮所有后代元素。find(expr|obj|ele):搜索所有與指定表達(dá)式匹配的子元素。parent([expr]):取得一個包含著所有匹配元素的唯一父元素的元素集合。offsetParent():返回第一個匹配元素用于定位的父節(jié)點。next([expr]):取得一個包含匹配的元素集合中每一個元素緊鄰的后面同輩元素的元素集合。nextAll([expr]):查找當(dāng)前元素之后所有的同輩元素。prev([expr]):取得一個包含匹配的元素集合中每一個元素緊鄰的前一個同輩元素的元素集合。prevAll([expr]):查找當(dāng)前元素之前所有的同輩元素。siblings([expr]):取得一個包含匹配的元素集合中每一個元素的所有唯一同輩元素的元素集合??梢杂每蛇x的表達(dá)式進(jìn)行篩選。串聯(lián)操作:add(expr|ele|html|obj[,con]):把與表達(dá)式匹配的元素添加到j(luò)Query對象中。這個函數(shù)可以用于連接分別與兩個表達(dá)式匹配的元素結(jié)果集。返回的結(jié)果將始終以元素在HTML文檔中出現(xiàn)的順序來排序,而不再是簡單的添加。andSelf():將先前所選的參加當(dāng)前元素中。end():回到最近的一個"破壞性"操作之前。即,將匹配的元素列表變?yōu)榍耙淮蔚臓顟B(tài)。如果之前沒有破壞性操作,那么返回一個空集。所謂的"破壞性"就是指任何改變所匹配的jQuery元素的操作。5:事件頁面載入事件:ready(fn):當(dāng)DOM載入就緒可以查詢及操縱時綁定一個要執(zhí)行的函數(shù)。這是事件模塊中最重要的一個函數(shù),因為它可以極大地提高web應(yīng)用程序的響應(yīng)速度。簡單地說,這個方法純粹是對向window.load事件注冊事件的替代方法。綁定事件:on(events,[selector],[data],fn):在選擇元素上綁定一個或多個事件的事件處理函數(shù)。off(events,[selector],[fn]):在選擇元素上移除一個或多個事件的事件處理函數(shù)。bind(type,[data],fn):為每個匹配元素的特定事件綁定事件處理函數(shù)。unbind(type,[data|fn]]):bind()的反向操作,從每一個匹配的元素中刪除綁定的事件。如果沒有參數(shù),那么刪除所有綁定的事件。one(type,[data],fn):為每一個匹配元素的特定事件〔像click〕綁定一個一次性的事件處理函數(shù)。hover([over,]out):當(dāng)鼠標(biāo)移動到一個匹配的元素上面時,會觸發(fā)指定的第一個函數(shù)。當(dāng)鼠標(biāo)移出這個元素時,會觸發(fā)指定的第二個函數(shù)。click([[data],fn]):觸發(fā)每一個匹配元素的click事件。這個函數(shù)會調(diào)用執(zhí)行綁定到click事件的所有函數(shù)。注:其他事件方

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論