前端專案中經常會有一個全域性的js，現下給大家分享一下我最近專案中常用到的函式

一、針對位址列操作

1. 獲取位址列某一引數

$.getUrlParam = function (name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]);
    return null;
};

/*測試 假設 當前地址url='https://so.csdn.net/so/search/s.do?q=javascript&t=2018&u=username'   */
console.log($.getUrlParam('q'),$.getUrlParam('t'),$.getUrlParam('u'));  //javascript   2018  username
 

2. 修改位址列某一引數

$.changeURLArg(url, arg, arg_val) {
    var pattern = arg + '=([^&]*)';
    var replaceText = arg + '=' + arg_val;
    if (url.match(pattern)) {
        var tmp = '/(' + arg + '=)([^&]*)/gi';
        tmp = url.replace(eval(tmp), replaceText);
        return tmp;
    } else {
        if (url.match('[\?]')) {
            return url + '&' + replaceText;
        } else {
            return url + '?' + replaceText;
        }
    }
    return url + '\n' + arg + '\n' + arg_val;
};

/*測試 假設 當前地址  */

var url='https://so.csdn.net/so/search/s.do?q=javascript&t=2018&u=username' ;
$.changeURLArg(url, 't', Date.parse(new Date())) ;
console.log(url) ;    //https://so.csdn.net/so/search/s.do?q=javascript&t=1545014248000&u=username;
 

3. 訪問地址 （主要結合下面的資料請求使用）；

$.getURL = function (host, URI) {
    URI = String(URI);
    var indexOf = URI.indexOf('http');
    if (Math.abs(indexOf) === indexOf) {
        return URI;
    } else {
        return host + URI;
    }
};
$.getApiHeader = function (URI) {
    return $.getURL(window.ApiHeader, URI);
};
 

二、資料請求

1. ajax請求
   由於我常用專案中post 用到情況比較多，這裡直接使用’POST’，各位可以結合專案自定義type

$.request = function (url, data, callback, type) {
    var full_url = $.getApiHeader(url);   //呼叫 上面3的函式
    data = JSON.stringify(data);  //data序列化
    $.ajax({
        type: 'POST',
        url: full_url,
        data: data,
        dataType: type,
        contentType: 'application/json;charset=UTF-8',
        success: function (res) {
        //這裡還能新增後端常規的返回錯誤資訊提示，如未登入，登入超時等
            callback(res);
        },
    });
};

2. 封裝表單提交

$.fn.extend({
    //封裝表單生成json方法
    serializeJson: function () {
        var data = $(this).serializeArray();
        var values = {};
        var dlen = data.length;
        for (var i = 0; i < dlen; i++) {
            var item = data[i];
            values[item.name] = item.value;
        }
        return values;
    }
});

三、封裝儲存

1.localStorage

/*存入*/
$.add = function (menuList, dataval) {
    dataval = dataval || [];
    localStorage.setItem(menuList, JSON.stringify(dataval));
};
/*讀取*/
$.get = function (menuList) {
    return JSON.parse(localStorage.getItem(menuList));
};
/*刪除某一項*/
$.remove = function (menuList) {
    localStorage.removeItem(menuList);
};
/*清空*/
$.clear = function () {
    localStorage.clear();
};

2. cookie

var Cookie = {};
/*存入*/
Cookie.setCookie = function (name, value, option) {
    var str = name + '=' + escape(value);
    if (option) {
        if (option.expireHours) {
            var d = new Date();
            d.setTime(d.getTime() + option.expireHours * 3600 * 1000);
            str += '; expires=' + d.toGMTString();
        }
        if (option.path) str += '; path=' + option.path;
        if (option.domain) str += '; domain=' + option.domain;
        if (option.secure) str += '; true';
    }
    document.cookie = str;
};
/*獲取某一項*/
Cookie.getCookie = function (name) {
    var arr = document.cookie.split('; ');
    if (arr.length == 0) return '';
    for (var i = 0; i < arr.length; i++) {
        tmp = arr[i].split('=');
        if (tmp[0] == name) return unescape(tmp[1]);
    }
    return '';
};
/*刪除某一項*/
Cookie.delCookie = function (name) {
    this.setCookie(name, '', {
        expireHours: -1,path:'/'
    });
};
/*檢查是否存在*/
Cookie.chkCookie = function (name) {
    var c = document.cookie.indexOf(name + "=");
    if (c != -1) {
        return true;
    } else {
        return false;
    }
};

後面還會不定期更新，對於開發之路尚才開始，希望各位大牛能提出一些意見，以及補充，謝謝！