工作中封装的js函数共享，拿去，不谢。

每个人工作中都会封装一些自己工作中常用的函数，鹏哥我也有一些，做了两年程序员，玩了两年前端开发，就这一点收藏，我也挺不好意思的（平时懒得整理，而且有的临时封装就用，不会放起来），不过就是少了点，平时用的不多，经常用到的就给封装了，至于效果组件就没封装。凑合拿去能用就用！别嫌弃。。。

【获取元素样式】

在工作中，我们经常会获取某一个DOM元素的样式信息，而且这个因为不兼容，所有就封装了一版。

//获取计算过后的样式***************************
/*function getStyle(obj,sName){
    if(obj.currentStyle){
        return obj.currentStyle[sName];
    }else{
        return getComputedStyle(obj,false)[sName];
    }
}*/
//获取计算过后的样式***************************
function getStyle(obj,sName){
    return (obj.currentStyle || getComputedStyle(obj,false))[sName]
}

【随机数】

平时工作中，我们经常会用到随机数啊，比如写随机展示的效果灯

//随机数*****************************************
function ran(n,m){
    return parseInt(Math.random()*(m-n)+n)
}

【数组找重复】

经常遇到操作数据，找重复，继续往下看，我也会说去重。

//找重复********************************************
function findInArr(n,arr){
    for(var i=0; i<arr.length; i++){
        if(arr[i]==n){
            //return arr[i]=n;
            return true;
        }
    }
    //return arr.push(n);
    return false;
}
//var arr=[1,2,3];
//alert(findInArr(5,arr));
//alert(arr);

【时间补零】

这个就经常经常遇到了，页面中我们经常会写时间，但是获取的js时间如果小于10，显示一位，为了美观所有需要补0.

//补零********************************************
function toDub(n){
    if(n<10){
        return '0'+n;
    }else{
        return ''+n;
    }
}

【通过class获取元素】

原生有这个方法，但是有兼容性问题，所有就给封装了一版，虽然不经常用，但是也会用到。

//getElementsByClassName**********************************
function getByClass(oParent,sClass){
    if(oParent.getElementsByClassName){
        return oParent.getElementsByClassName(sClass);
    }else{
        var aElement=oParent.getElementsByTagName('*');
        var arr=[];
        for(var i=0; i<aElement.length; i++){
            var aClass=aElement[i].className.split(' ');
            for(var j=0; j<aClass.length; j++){
                if(aClass[j]==sClass){
                    arr.push(aElement[i]);
                }
            }
        }
        return arr
    }
}

【获取物体绝对的位置】

这个就经常用了，比如图片延迟加载，比如获取一个DOM元素的位置，等等。

//绝对宽高*****************************************
function getPos(obj){
    var l=0;
    var t=0;

    while(obj){
        l+=obj.offsetLeft;
        t+=obj.offsetTop;
        obj=obj.offsetParent;
    }
    return {left:l,top:t}
}

【事件绑定】

这个就不用说了，工作中我们的事件都是要绑定的。

//添加事件***************************************
function addEvent(obj,sEv,fn){
    if(obj.addEventlistener){
        obj.addEventlistener(sEv,fn,false);
    }else{
        obj.attachEvent('on'+sEv,fn);
    }
}

【事件解绑】

这个也不用说，和上面那个一样。

//解除事件*****************************************
function removeEvent(obj,sEv,fn){
    if(obj.removeEventlistener){
        obj.removeEventlistener(sEv,fn,false);
    }else{
        obj.detachEvent('on'+sEv,fn);
    }
}

【添加滚轮事件】

这个偶尔会遇到，比如你写一个需要自己自定义一个滚动条的页面，就会用到。不过有插件，用这个也少。

//添加滚轮事件***************************************
function addWheel(obj,fn){
    if(navigator.userAgent.toLowerCase().indexOf('firefox')!=-1){
        obj.addEventListener('DOMMouseScroll',wheel,false);            //火狐
    }else{
        obj.onmousewheel=wheel;                                        //非火狐
    }
    function wheel(ev){
        var bDown=true;
        var oEvent=ev || event;
        if(oEvent.wheelDelta){
            if(oEvent.wheelDelta>0){
                bDown=false;
            }else{
                bDown=true;
            }
        }else{
            //火狐
            if(oEvent.detail>0){
                bDown=true;
            }else{
                bDown=false;
            }
        }
        fn&&fn(bDown);
        oEvent.preventDefault&&oEvent.preventDefault(); //阻止默认事件(事件绑定中的默认事件) 只能用在高级浏览器中
        return false;                //阻止默认事件
    }
}

【个人js运动框架引擎】

这个之前用到的非常非常多，之前没有用css3的时候就靠这个写效果，虽然有人说，鹏哥，不是有jq吗，那我会告诉你，一个小页面你会引库嘛。。不过目前有了css3运动，就不需要这个了。

//运动框架***************************************
function move(obj,json,option){
    var option=option || {};
    var duration=option.duration || 1000;
    var easing=option.easing || 'linear';
    var start={};  //寸初始值
    var dis={};//存总路程
    //json->{'width':300,'height':300,'opacity':0}
    //start->{width:100,height:100,opacity:1}
    //dis ->{width:200,height:200,opacity:1}
    for(var name in json){
        start[name]=parseFloat(getStyle(obj,name));
        //start['width']=100;
        dis[name]=json[name]-start[name];
        //dis['width']=200;
    }

    var count= Math.ceil(duration/30);   //总次数
    var n=0;  //循环需要统计的次数

    clearInterval(obj.timer);
    obj.timer=setInterval(function(){
        n++;
        for(var name in json){
            switch (easing){
                case 'linear':   //匀速
                    var a=n/count;
                    var cur=start[name]+dis[name]*a;
                    break;
                case 'ease-in':  // 加速
                    var a=n/count;
                    var cur=start[name]+dis[name]*a*a*a;
                    break;
                case 'ease-out':  //减速
                    var a=1-n/count;
                    var cur=start[name]+dis[name]*(1-a*a*a);
                    break
            }
            if(name=='opacity'){
                obj.style.opacity=cur;
            }else{
                obj.style[name]=cur+'px';
            }
        }

        if(n==count){
            clearInterval(obj.timer);
            option.complete && option.complete();
        }
    },30);
}

【DOM加载事件】

这个也用到的非常多，和window.onload有区别，这个加载仅仅是代码加载了就会执行。

//DOM事件**********************************************
function ready(fn){
    if(document.addEventListener){
        document.addEventListener('DOMContentLoaded',fn,false)
    }else{
        document.onreadystatechange=function(){
            if(document.readyState=='complete'){
                fn();
            }
        };
    }
}

【cookie使用】

这个就不用说了，之前用的非常多，每个页面基本都会有cookie的存在。不过目h5出现的两个离线存储基本把这个代替了。。。

//设置cookie*********************************************
function setCookie(sName,sValue,iDay){
    if(iDay){
        var oDate=new Date();
        oDate.setDate(oDate.getDate()+iDay);
        document.cookie=sName+'='+sValue+'; expires='+oDate+'; path=/';
    }else{
        document.cookie=sName+'='+sValue+'; path=/';
    }
}

//获取cookie**********************************************
function getCookie(sName){
    var str=document.cookie;
    var arr1=str.split('; ');
    for(var i=0; i<arr1.length; i++){
        var arr2=arr1[i].split('=');
        if(arr2[0]==sName){
            return arr2[1]
        }
    }
    return ''
}

//删除Cookie**********************************************
function removeCookie(sName){
    setCookie(sName,' ',-1);
}

【解析后台获取的数据json】

平时我们从后台获取的数据都是字符串，而且经常是字符串的json，解析有两种方法，性能不同，所以就给封装起来了。

//解析json*************************************************
function parseJson(str){
    try{
        return JSON.parse(str);
    }catch(e){
        return eval('('+str+')');
    }
}

【个人ajax交互封装】

重中之重。平时写页面交互效果的时候，经常用，虽然每一个库框架都会有这个，但是一些页面就是需要原生来写，所有用的非常多，给封装了起来。

//ajax*******************************************************
function ajax(json){    //url, data, type, timeout, success, error
    json=json || {};
    json.data=json.data || {};
    json.type=json.type || 'get';
    json.timeout=json.timeout || 0;

    var arr=[];
    for(var name in json.data){
        arr.push(name+'='+encodeURIComponent(json.data[name]))
    }
    var sData=arr.join('&');

    try{
        var oAjax=new XMLHttpRequest;
    }catch(e){
        var oAjax=new ActiveXObject('Microsoft.XMLHTTP');
    }

    if(json.type=='post'){
        oAjax.open('POST',json.url,true);
        oAjax.setRequestHeader('content-type','application/x-www-form-urlencoded');
        oAjax.send(sData);
    }else{
        oAjax.open('GET',json.url+'?'+sData,true);
        oAjax.send();
    }

    oAjax.onreadystatechange=function(){
        if(oAjax.readyState==4){
            clearTimeout(timer);
            if((oAjax.status>=200 && oAjax.status<300) || oAjax.status==304){
                json.success && json.success(oAjax.responseText);
            }else{
                json.error && json.error(oAjax.status);
            }
        }
    };

    if(json.timeout){
        var timer=setTimeout(function(){
            oAjax.abort();
        },json.timeout);
    }
}

【后台的时间戳转时间】

平时交互，从后台获取的时间是时间戳，而且是秒为单位。所有就写了一个转化的函数。

//时间戳转JS时间********************************************
function setTime(t){
  function toDou(n){
    return n<10?'0'+n:''+n;
  }
  var oDate=new Date();
  oDate.setTime(t*1000);

  return oDate.getFullYear()+'-'+(oDate.getMonth()+1)+'-'+oDate.getDate()+'  '+toDou(oDate.getHours())+':'+toDou(oDate.getMinutes())+':'+toDou(oDate.getSeconds());
}

【角度弧度转化】

这个也用的挺多的，比如css3，或者是canvas中都会用。

//角度转弧度********************************************
function d2a(n){
    //弧度 = π/180×角度
    return n*Math.PI/180;
}

//弧度转角度********************************************
function a2d(n){
    //角度 = 180/π×弧度
    return n*180/Math.PI;
}

【数组求最大最小数】

经常用，经常会从后台获取一组数据，但是我们要从中找出最大或者是最小的展示，所以鹏哥就给封装起来了。

//查找数组中的最大值********************************************
function findMax(arr){
    var iMax=arr[0];
    for(var i=0; i<arr.length; i++){
        if(arr[i]>iMax){
            iMax=arr[i];
        }
    }
    return iMax;
}

//查找数组中的最小值********************************************
function findMin(arr){
    var iMin=arr[0];
    for(var i=0; i<arr.length; i++){
        if(arr[i]<iMin){
            iMin=arr[i];
        }
    }
    return iMin;
}

【数组去重】

这个就不用说了，用处非常多，虽然数组去重有无数种方法，但是我还是喜欢这一种。

//数组去重*********************************************************
function remArr(arr){
    arr.sort();
    for(var i=0; i<arr.length; i++){
        if(arr[i]==arr[i+1]){
            arr.splice(i,1);
            i--;
        }
    }
    return arr;
}

附加小方法：数字取几位小数（这个是Number的方法，以防从数据库取到的是字符串型数字，所有转化一下数据类型）
Number(*).toFixed(取几位就放几 如 2)  

日期整理：利用字符串的replace替换功能+正则匹配 如 str ='20160920145530';
str.replace(/(\d{4})(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/,'$1-$2-$3 $4:$5:$6')  => 2016-09-20 14:55:30 格式自己随便写，看情况

以上，结束，后期工作中封装的会继续上传，以后鹏哥也会把一些js效果的，以及组件给封装收藏好。陆续更新。