使用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