jQuery外掛程式的怎麼寫

2022-09-07 21:18:20 字數 1531 閱讀 1497

對於jquery之前一直用,也看到過別人寫的外掛程式,直到最近才想著學習怎麼寫自己的jquery外掛程式,今天看了網上的一些資料,發現其實很簡單的。

先看乙個簡單的jquery外掛程式的例子

使用的時候要先導入jquery外掛程式,比如$("p").bold().red(),這樣p標籤內容就會變為紅色粗體。

那麼,如何寫乙個正確的jquery的外掛程式呢?

首先,外掛程式的結構是這樣的

(function

($))(jquery);

這種結構在j**ascript中叫做閉包,能夠不被編譯器執行。

然後,在閉包中寫外掛程式的功能,有兩種寫法

第一種:就是上面例子中的,這種適合寫有多個函式的外掛程式,例子中的bold和red就是定義的兩個外掛程式的名字。

第二種:

(function

($));

};jquery.fn.red=function

());

}})(jquery);

可以看做是定義了兩個函式,分別是bold和red。

jquery.extend()的介紹和使用

注意,區別於上面的jquery.fn.extend()。

jquery.extend()有幾個過載方法

一、jquery.extend(desc,src1,src2,src3...)

用來把後面的引數src1、src2。。合併到desc中,比如

var src1=

var src2=

var desc=

var result=jquery.extend(desc,src1,src2),

結果result=,同時desc也變為合併後的值,也就是說如果後面的引數和前面的引數有相同的屬性值,則後面的屬性會覆蓋前面的屬性。有時候我們不希望改變desc的值,則可以用{}代替desc,

jquery.extend({},src1,src2,...)

上述的extend方法原型中的dest引數是可以省略的,如果省略了,則該方法就只能有乙個src引數,而且是將該src合併到呼叫extend方法的物件中去,如:

$.extend(src)

該方法就是將src合併到jquery的全域性物件中去,如:

$.extend(

});

二、jquery.extend(boolean,desc,src1,src2...)

第乙個boolean為布林值,意為是否深度覆蓋,後面的引數與上面的一致。所謂深度覆蓋,看下面的例子。

var result=jquery.extend(true

,{},

},)

則結果為result=}

如果第乙個引數為false,則結果應該是這樣result=}

下面是乙個較完整的例子

寫jquery外掛程式的思路

不要覺得寫外掛程式很難,只是你把問題想的太複雜了,本文教你在10分鐘內搞定乙個簡單的外掛程式。其實就是把一些常用 實用 通用的功能封裝起來而以,簡單的來講就是把這些 放在乙個方法裡面,可以達到重複使用的效果,這樣就可以不需要每次要用此功能的時候都去重新寫一遍。1.先定義乙個外掛程式 function...

jquery怎麼寫,效率最高

最近看到一些不錯的文章,轉來坐一下筆記。其內容和一些新提供的方法還是很多有值得學習的地方。1.使用最新版本的jquery jquery的版本更新很快,你應該總是使用最新的版本。因為新版本會改進效能,還有很多新功能。下面就來看看,不同版本的jquery效能差異有多大。這裡是三條最常見的jquery選擇...

關於jQuery寫外掛程式及其演示

關於寫jquery外掛程式是很有必要的,這是前端學習當中必須經過的乙個過程 對於初次寫外掛程式先想清楚原理 function var options extend defaults,options this.each function jquery 這是乙個基礎的模板 其中的var options ...