經常使用js函數

 /**   AJAX封裝  原生js   **/
        ajax({
            url:"https://open.weixin.qq.com/connect/qrconnect", //請求地址
            type:"GET",   //請求方式
            data:{appid:"wx82670fae8b0fa28d",redirect_uri:"http://abc.lalabb.cn",response_type:"code",scope:"snsapi_login"},   // 請求參數
            datatype:"json",
            success:function(response,xml){
                // 成功後執行的代碼
                console.log(response);
            },
            fail:function(status){
                // 失敗後執行的代碼
            }
        });

        function ajax(options){
            options = options || {};
            options.type = (options.type || "GET").toUpperCase();
            options.dataType = options.dataType || "json";
            var params = formatParams(options.data);
             //xhr 兼容IE6
             if(window.XMLHttpRequest){
                 var xhr = new XMLHttpRequest();
             }else{
                var xhr = new ActiveXObject('Microsoft.XMLHTTP');
             }
             // 接收
            xhr.onreadystatechange = function(){
                if(xhr.readyState == 4){
                    var status = xhr.status;
                    if(status>=200 && status < 300){
                        options.success && options.success(xhr.responseText, xhr.responseXML);
                    }else{
                        options.fail && options.fail(status);
                    }
                }
            }
            // 連接 / 發送
            if(options.type == "GET"){
                xhr.open("GET",options.url+"?"+params,true);
                xhr.send(null);
            }else if(options.type == "POST"){
                xhr.open("POST",options.url,true);
                // 設置表單提交時的內容類型
                xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
                xhr.send(params);
            }
        }

        // 格式化參數
        function formatParams(data){
            var arr = [];
            for(var name in data){
                arr.push(encodeURIComponent(name) + "=" + encodeURIComponent(data[name]));
            }
            arr.push(("v="+Math.random()).replace(".",""));
            return arr.join("&");
        }

/**   判斷微信內置瀏覽器   **/
        function isWeiXin(){
            var ua = window.navigator.userAgent.toLowerCase();
            if(ua.match(/MicroMessenger/i) == 'micromessenger'){
                // 是微信瀏覽器執行
                alert('true');
            }else{
                // 其餘瀏覽器執行
                alert('false');
            }
        }


/**   獲取url參數   **/
function getUrlParam(name){
    var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); //構造一個含有目標參數的正則表達式對象
    var r = window.location.search.substr(1).match(reg);  //匹配目標參數
    if (r!=null) return unescape(r[2]); return null; //返回參數值
}



/**    原生js  get   **/
var XHR=null;  
if (window.XMLHttpRequest) {  
    // 非IE內核  
    XHR = new XMLHttpRequest();  
} else if (window.ActiveXObject) {  
    // IE內核,這裏早期IE的版本寫法不一樣,具體能夠查詢下  
    XHR = new ActiveXObject("Microsoft.XMLHTTP");  
} else {  
    XHR = null;  
}  
 
if(XHR){  
    XHR.open("GET", "ajaxServer.action");  
 
    XHR.onreadystatechange = function () {  
        // readyState值說明  
        // 0,初始化,XHR對象已經建立,還未執行open  
        // 1,載入,已經調用open方法,可是還沒發送請求  
        // 2,載入完成,請求已經發送完成  
        // 3,交互,能夠接收到部分數據  
 
        // status值說明  
        // 200:成功  
        // 404:沒有發現文件、查詢或URl  
        // 500:服務器產生內部錯誤  
        if (XHR.readyState == 4 && XHR.status == 200) {  
            // 這裏能夠對返回的內容作處理  
            // 通常會返回JSON或XML數據格式  
            console.log(XHR.responseText);  
            // 主動釋放,JS自己也會回收的  
            XHR = null;  
        }  
    };  
    XHR.send();  
}  






/**    判斷是否爲手機瀏覽器    **/

var browser={
    versions:function(){
           var u = navigator.userAgent, app = navigator.appVersion;
           return {//移動終端瀏覽器版本信息
                trident: u.indexOf('Trident') > -1, //IE內核
                presto: u.indexOf('Presto') > -1, //opera內核
                webKit: u.indexOf('AppleWebKit') > -1, //蘋果、谷歌內核
                gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐內核
                mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), //是否爲移動終端
                ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端
                android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android終端或者uc瀏覽器
                iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否爲iPhone或者QQHD瀏覽器
                iPad: u.indexOf('iPad') > -1, //是否iPad
                webApp: u.indexOf('Safari') == -1 //是否web應該程序,沒有頭部與底部
            };
         }(),
         language:(navigator.browserLanguage || navigator.language).toLowerCase()
}
// document.writeln("語言版本: "+browser.language);
// document.writeln(" 是否爲移動終端: "+browser.versions.mobile);
// document.writeln(" ios終端: "+browser.versions.ios);
// document.writeln(" android終端: "+browser.versions.android);
// document.writeln(" 是否爲iPhone: "+browser.versions.iPhone);
// document.writeln(" 是否iPad: "+browser.versions.iPad);
// document.writeln(navigator.userAgent);

/**    判斷手機端仍是pc端    **/
function browserRedirect() {
            var sUserAgent = navigator.userAgent.toLowerCase();
            var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
            var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
            var bIsMidp = sUserAgent.match(/midp/i) == "midp";
            var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
            var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
            var bIsAndroid = sUserAgent.match(/android/i) == "android";
            var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
            var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
            document.writeln("您的瀏覽設備爲:");
            if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
                document.writeln("phone");
            } else {
                document.writeln("pc");
            }
        }

        browserRedirect();


// 動態加載外部js文件
var flag = true;
if( flag ){
    loadScript( "js/index.js" );
};
function loadScript( url ){
    var script = document.createElement( "script" );
    script.type = "type/javascipt";
    script.src = url;
    document.getElementsByTagName( "head" )[0].appendChild( script );
};

// 動態加載外部css樣式
if( flag ){
    loadCss( "css/base.css" );
};
function loadCss( url ){
    var link = document.createElement( "link" );
    link.type = "text/css";
    link.rel = "stylesheet";
    link.href = url;
    document.getElementsByTagName( "head" )[0].appendChild( link );
};


// jquery 動態加載js後執行callback
<script src="/lib/js/jquery.min.js"></script>
<script>
     var loadScripts= function (files, callback) {
        var file = files.shift();
        $.getScript(file, function () {
            if (files.length) {
                loadScripts(files, callback);
            } else {
                if (callback) {
                    callback();
                }
            }
        });
    }

    loadScripts(['test.js'],function(){
        alert(str);
    })
</script>

//   jsonp方式
function jsonp(config) {
    var options = config || {};   // 須要配置url, success, time, fail四個屬性
    var callbackName = ('jsonp_' + Math.random()).replace(".", "");
    var oHead = document.getElementsByTagName('head')[0];
    var oScript = document.createElement('script');
    oHead.appendChild(oScript);
    window[callbackName] = function(json) {  //建立jsonp回調函數
        oHead.removeChild(oScript);
        clearTimeout(oScript.timer);
        window[callbackName] = null;
        options.success && options.success(json);   //先刪除script標籤,實際上執行的是success函數
    };
    oScript.src = options.url + '?' + callbackName;    //發送請求
    if (options.time) {  //設置超時處理
        oScript.timer = setTimeout(function () {
            window[callbackName] = null;
            oHead.removeChild(oScript);
            options.fail && options.fail({ message: "超時" });
        }, options.time);
    }
    };
// 使用方法:
jsonp({
    url: '/b.com/b.json',
    success: function(d){
        //數據處理
    },
    time: 5000,
    fail: function(){
        //錯誤處理
    }      
    });

// 調用視頻全屏模式
function videoFull(docElm){
    console.log("全屏模式");
    // var docElm = document.getElementById(id);
    //W3C
    if(docElm.requestFullscreen){
        docElm.requestFullscreen();
    }
    //FireFox
    else if (docElm.mozRequestFullScreen) {
        docElm.mozRequestFullScreen();
    }
    //Chrome等
    else if (docElm.webkitRequestFullScreen) {
        docElm.webkitRequestFullScreen();
    }
    //IE11
    else if (elem.msRequestFullscreen) {
        elem.msRequestFullscreen();
    }
}
// 退出全屏
function closeVideoFull(docElm){
    if (document.exitFullscreen) {
        document.exitFullscreen();
    }else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    }else if (document.webkitCancelFullScreen) {
        document.webkitCancelFullScreen();
    }else if (document.msExitFullscreen) {
        document.msExitFullscreen();
    }
}

// 截取固定數量的字符串
cutStr(str,36,6,10)   6個字或10字母和數字
function cutStr(str,codeNum,textNum,num){
    var len = escape(str).length;
    if(len>codeNum){
        var s = str.substr(0,textNum)+"...";
        return s;
    }else if(len<codeNum){
        if(str.length>num){
            var s = str.substr(0,num)+"...";
            return s;
        }else{
            return str;
        }
        
    }else{
        return str;
    }
};

// 去掉時間 2016-11-28 14:27:52 的秒
function cutTime(str){
    str = str.replace(/-/g,"/");
    var date = new Date(str );
    var timeStamp = date.getTime();
    var m = date.getMonth() + 1;
    var d = date.getDate();
    var start = str.indexOf(" ") + 1;
    var end = str.lastIndexOf(":");
    var newStr = m + "月" + d + "日" + str.substring(start,end);
    // 時間格式 11月28日14:27   // 時間戳
    return {"timeStr":newStr,"timeStamp":timeStamp};
}

// 無刷新修改url
   function changeURL(){
                var url = document.getElementById('url').value;
                window.history.pushState({},0,'http://'+window.location.host+'/'+url);      
           }

// 按照漢語拼音字母排序
var array = ['武漢', '北京', '上海', '天津'];
array = array.sort(
    function compareFunction(param1, param2) {
        return param1.localeCompare(param2);
    }
);
console.log(array);

//獲取頁面文件名和參數
function GetPageurl(){
    var url=window.location.href;//獲取完整URL地址
    var tmp= new Array();//臨時變量,用於保存分割字符串
    tmp=url.split("/");//按照"/"分割
    var cc = tmp[tmp.length-1];//獲取最後一部分,即文件名和參數
    tmp=cc.split("?");//把參數和文件名分割開
    return tmp[0];//返回值
}

// 判斷是否安裝flash
    function flashChecker() {  
        var hasFlash = 0;         //是否安裝了flash  
        var flashVersion = 0; //flash版本  
        var isIE = /*@cc_on!@*/0;      //是否IE瀏覽器  
 
        if (isIE) {  
            var swf = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');  
            if (swf) {  
                hasFlash = 1;  
                VSwf = swf.GetVariable("$version");  
                flashVersion = parseInt(VSwf.split(" ")[1].split(",")[0]);  
            }  
        } else {  
            if (navigator.plugins && navigator.plugins.length > 0) {  
                var swf = navigator.plugins["Shockwave Flash"];  
                if (swf) {  
                    hasFlash = 1;  
                    var words = swf.description.split(" ");  
                    for (var i = 0; i < words.length; ++i) {  
                        if (isNaN(parseInt(words[i]))) continue;  
                        flashVersion = parseInt(words[i]);  
                    }  
                }  
            }  
        }  
        return { f: hasFlash, v: flashVersion };  
    }  
 
    var fls = flashChecker();  
    var s = "";  
    if (fls.f) document.write("您安裝了flash,當前flash版本爲: " + fls.v + ".x");  
    else document.write("您沒有安裝flash");  

// 簡單提示彈出層
function dialog(str){
    var layer=document.createElement("div");
    layer.id="layer";
    layer.innerHTML = str;
    var style={
        "background": "rgba(0, 0, 0, 0.4)",
        "border-radius": "5px",
        "bottom": "0",
        "color": "#fff",
        "font-size": "0.35rem",
        "height": "1rem",
        "left": "0",
        "line-height": "1rem",
        "margin": "auto",
        "position": "fixed",
        "right": "0",
        "text-align": "center",
        "top": "0",
        "width": "2.8rem",
        "z-index": "999"
    }
    for(var i in style){
        layer.style[i]=style[i];   
    }
    if(document.getElementById("layer")==null){
        document.body.appendChild(layer);
        setTimeout("document.body.removeChild(layer)",1500);
    }
}css


=========================================================================================================================html

jquery ajax函數java

我本身封裝了一個ajax的函數,代碼以下:
var Ajax = function(url, type success, error) {
    $.ajax({
        url: url,
        type: type,
        dataType: 'json',
        timeout: 10000,
        success: function(d) {
            var data = d.data;
            success && success(data);
        },
        error: function(e) {
            error && error(e);
        }
    });
    };
// 使用方法:
Ajax('/data.json', 'get', function(data) {
    console.log(data);
    });
jsonp方式

有時候咱們爲了跨域,要使用jsonp的方法,我也封裝了一個函數:
function jsonp(config) {
    var options = config || {};   // 須要配置url, success, time, fail四個屬性
    var callbackName = ('jsonp_' + Math.random()).replace(".", "");
    var oHead = document.getElementsByTagName('head')[0];
    var oScript = document.createElement('script');
    oHead.appendChild(oScript);
    window[callbackName] = function(json) {  //建立jsonp回調函數
        oHead.removeChild(oScript);
        clearTimeout(oScript.timer);
        window[callbackName] = null;
        options.success && options.success(json);   //先刪除script標籤,實際上執行的是success函數
    };
    oScript.src = options.url + '?' + callbackName;    //發送請求
    if (options.time) {  //設置超時處理
        oScript.timer = setTimeout(function () {
            window[callbackName] = null;
            oHead.removeChild(oScript);
            options.fail && options.fail({ message: "超時" });
        }, options.time);
    }
    };
// 使用方法:
jsonp({
    url: '/b.com/b.json',
    success: function(d){
        //數據處理
    },
    time: 5000,
    fail: function(){
        //錯誤處理
    }      
    });

經常使用正則驗證表達式:

*****手機號驗證
var validate = function(num) {
    var exp = /^1[3-9]\d{9}$/;
    return exp.test(num);
    };

*****身份證號驗證
var exp = /^[1-9]{1}[0-9]{14}$|^[1-9]{1}[0-9]{16}([0-9]|[xX])$/;

*****ip驗證
var exp = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;jquery


經常使用js函數:android

**********返回頂部
$(window).scroll(function() {
    var a = $(window).scrollTop();
    if(a > 100) {
        $('.go-top').fadeIn();
    }else {
        $('.go-top').fadeOut();
    }
    });
$(".go-top").click(function(){
    $("html,body").animate({scrollTop:"0px"},'600');
    });ios


**********阻止冒泡
function stopBubble(e){
    e = e || window.event;  
    if(e.stopPropagation){
        e.stopPropagation();  //W3C阻止冒泡方法  
    }else {  
        e.cancelBubble = true; //IE阻止冒泡方法  (**好像很差使**)
    }  web

}ajax


**********所有替換replaceAll
var replaceAll = function(bigStr, str1, str2) {  //把bigStr中的全部str1替換爲str2
    var reg = new RegExp(str1, 'gm');
    return bigStr.replace(reg, str2);
    }正則表達式


**********獲取瀏覽器url中的參數值
var getURLParam = function(name) {
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)', "ig").exec(location.search) || [, ""])[1].replace(/\+/g, '%20')) || null;
    };json


*********深度拷貝對象
function cloneObj(obj) {
    var o = obj.constructor == Object ? new obj.constructor() : new obj.constructor(obj.valueOf());
    for(var key in obj){
        if(o[key] != obj[key] ){
            if(typeof(obj[key]) == 'object' ){
                o[key] = mods.cloneObj(obj[key]);
            }else{
                o[key] = obj[key];
            }
        }
    }
    return o;
    }


********數組去重
var unique = function(arr) {
    var result = [], json = {};
    for (var i = 0, len = arr.length; i < len; i++){
        if (!json[arr[i]]) {
            json[arr[i]] = 1;
            result.push(arr[i]);  //返回沒被刪除的元素
        }
    }
    return result;
    };


**********判斷數組元素是否重複
var isRepeat = function(arr) {  //arr是否有重複元素
    var hash = {};
    for (var i in arr) {
        if (hash[arr[i]]) return true;
        hash[arr[i]] = true;
    }
    return false;
    };


**********生成隨機數
function randombetween(min, max){
    return min + (Math.random() * (max-min +1));
    }


************操做cookie
own.setCookie = function(cname, cvalue, exdays){
    var d = new Date();
    d.setTime(d.getTime() + (exdays*24*60*60*1000));
    var expires = 'expires='+d.toUTCString();
    document.cookie = cname + '=' + cvalue + '; ' + expires;
    };
own.getCookie = function(cname) {
    var name = cname + '=';
    var ca = document.cookie.split(';');
    for(var i=0; i< ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') c = c.substring(1);
        if (c.indexOf(name) != -1) return c.substring(name.length, c.length);
    }
    return '';
    };

*************知識技巧總結

數據類型

underfined、null、0、false、NaN、空字符串。他們的邏輯非結果均爲true。

閉包格式
好處:避免命名衝突(全局變量污染)。
(function(a, b) {
    console.log(a+b);  //30
    })(10, 20);


截取和清空數組
var arr = [12, 222, 44, 88];
arr.length = 2;   //截取,arr = [12, 222];  
arr.length = 0;   //清空,arr will be equal to [].


獲取數組的最大最小值
var numbers = [5, 45822, 120, -215];
var maxInNumbers = Math.max.apply(Math, numbers);   //45822
var minInNumbers = Math.min.apply(Math, numbers);   //-215


浮點數計算問題
0.1 + 0.2 == 0.3   //false
爲何呢?由於0.1+0.2等於0.30000000000000004。JavaScript的數字都遵循IEEE 754標準構建,在內部都是64位浮點小數表示。能夠經過使用toFixed()來解決這個問題。

數組排序sort函數
var arr = [1, 5, 6, 3];    //數字數組
arr.sort(function(a, b) {
    return a - b;   //從小到大排
    return b - a;   //從大到小排
    return Math.random() - 0.5;   //數組洗牌
    });
var arr = [{   //對象數組
    num: 1,
    text: 'num1'
    }, {
    num: 5,
    text: 'num2'
    }, {
    num: 6,
    text: 'num3'
    }, {
    num: 3,
    text: 'num4'
    }];   
arr.sort(function(a, b) {
    return a.num - b.num;   //從小到大排
    return b.num - a.num;   //從大到小排
    });


對象和字符串的轉換var obj = {a: 'aaa', b: 'bbb'};var objStr = JSON.stringify(obj);    // "{"a":"aaa","b":"bbb"}"var newObj = JSON.parse(objStr);     // {a: "aaa", b: "bbb"}

相關文章
相關標籤/搜索