使用jQuery封裝實用函數

1、引言

項目開發中，前端會有一個輔助工具類的js文件，好比cookie的操做，團隊成員本身封裝的方法。大多數時候，咱們開發人員本身都是寫一個全局函數，不考慮後期維護人員也會寫相同的代碼，而後形成代碼之間的衝突。以前維護的一段代碼以下：

 

var g=function(id){
    return document.getElementById(id);
};

var $$=function(id){
    return document.getElementById(id);
};
g("testdiv").style.color="red";
$$("testdiv").innerHTML="this is a test.";

 

由於代碼歷史久遠，也不知道是否是在jQuery出來以前寫的呢，仍是以後。開發者爲了節省後面寫document.getElementById()這個方法，在頁面竟然用了兩個縮寫去替代。$$應該後面的開發人員添加進去的，可能他以爲使用g來代替document.getElementById()不是很明顯。這個也說明，在開發過程當中，不少開發者爲了去大規模修改別人的代碼，咱們喜歡在別人代碼上添加內容，不想刪除內容。這樣項目是能夠運行了，可是大量冗餘代碼也產生了，對後期的維護和重構很是的不利。以上只是舉個實際項目中例子。

2、實例

後面引入jQuery以後，開發者大多數都喜歡用$來替代。到目前爲止，我使用的第三方類庫，基本上沒有以$來定義的。因此基本上沒有出現過$表明的不是jQuery對象。可是爲了代碼可維護性，而且在咱們寫代碼中，使用的$是jQuery對象，咱們須要安全進行編寫函數。由於有時項目的名字不一樣，咱們還會使用命名空間才區分它們。

(function($){
    $.say=function(what){
        alert("I say "+what);
    }
})(jQuery);

這裏咱們將jQuery對象傳入到函數中，以確保咱們在函數內部使用的$是jQuery對象。

3、一個複雜的示例

標籤: jQuery, jQuery插件, javascript