js 封装的一些小函数

1.获取物体的绝对位置

//json里面存了两个数据，调用时直接getPos(obj).left或者getPos(obj).top
//获取绝对位置
function getPos(obj){
    var l=0;
    var t=0;
    while(obj){
        //obj 对象只要成立，就说明还有定位父级。 这种情况下变量l和t就会一直加等于当前对象到定位父级的top或left值。     一直加到没有定位父级为止，此时while循环自然就停止了。    return出的值也就是最后的绝对距离。
        l+=obj.offsetLeft;//物体的左边距(到有定位父级的一个左边距)
        t+=obj.offsetTop;//物体的上边距(到有定位父级的一个左边距)

        obj=obj.offsetParent;//定位上的父级
    }
    return {left:l,top:t}
}

2.获取物体的非行间样式

    /*
     * @desc 获取非行间样式
     * @parmas Object
     * @parmas String
     * @return String
     */
    function getStyle(obj,name) {
        if(obj.currentStyle){
            return obj.currentStyle[name];
        }else{
            return getComputedStyle(obj,false)[name];
        }
    }

3.运动框架

function getStyle(obj,name){
    if(obj.currentStyle){
        return obj.currentStyle[name];
    }else {
        return getComputedStyle(obj,false)[name];
    }
}
//传参的obj就是变量对象（类似oDiv）
//json就是一个json
//options也是json
function startMove(obj,json,options){
    //timer前一定要加obj，因为timer需要重用，不止关一次。 如果不加obj定时器就关不了；就得出事了。
    clearInterval(obj.timer);//一定要加obj。
    options=options || {};//默认值（如果没有就执行后面的所以是空josn）
    //因为是未定义的，所以未定义等于未定义还是未定义。 就会默认执行 || 后面的东西
    options.duration=options.duration || 300;//默认值（同上）
    options.easing=options.easing || 'ease-in';//默认值（同上）

    //总次数，必须是整数
    var cont=Math.floor(options.duration/30);//30毫秒（定死的数）

    var start={};//空josn
    var dis={};//空josn

    for(var name in json){//循环josn
        start[name]=parseFloat(getStyle(obj,name));//物体的原始信
        if(isNaN(start[name])){//详细条件
            switch (name){
                case 'left':
                    start[name]=obj.offsetLeft;
                    break;
                case 'top':
                    start[name]=obj.offsetTop;
                    break;
                case 'width':
                    start[name]=obj.offsetWidth;
                    break;
                case 'height':
                    start[name]=obj.offsetHeight;
                    break;
                case 'marginLeft':
                    start[name]=0;
                    break;
                case 'marginTop':
                    start[name]=0;
                    break;
                case 'fontSize':
                    start[name]=12;
                    break;
                //.......

            }
        }
        //json[name]设置的运动多少的值
        //start[name]物体本来的位置，高度或者透明度等等；
        dis[name]=json[name]-start[name];//运动了多远
        //dis[name] 运动了多少。  下面for  in 循环里面需要用到
    }
    var n=0;//存一个变量
    obj.timer=setInterval(function(){
        n++;//让变量不断的加
        for(var name in json){//循环josn
            switch(options.easing){
                case 'linear'://匀速
                    //下面两个变量就是（var cur=start+n*dis/cont;//现在哪儿）拆开的样子。 位子可以不分（var cur=start+dis*n/cont;）然后n/cont就可以提取上去了
                    var a=n/cont;
                    var cur=start[name]+dis[name]*a;
                    break;
                case 'ease-in'://加速度（先慢后快）
                    var a=n/cont;
                    var cur=start[name]+dis[name]*a*a*a;
                    break;
                case 'ease-out'://缓冲（先快后慢）
                    var a=1-n/cont;
                    var cur=start[name]+dis[name]*(1-a*a*a);
                    break;
            }
            if(name=='opacity'){//因为opacity不带px。所以必须把它判断出来
                obj.style.opacity=cur;
                obj.style.filter='opacity('+cur*100+')';//处理兼容
            }else {
                //obj.style[name]为宽度时就是obj.style.width
                //cur就是上面计算运动后的位子，高度或者透明度
                obj.style[name]=cur+'px';//最终给属性赋值
            }
        }

        if(n==cont){
            clearInterval(obj.timer);//关定时器
            //这是三传参最后一个。  josn名为options内存的一个函数
            //调用格式为complete:function(){aleat（1）}  complete必须写在前面
            options.complete && options.complete();
        }
    },30);
}

4.找有没有重复的数

function findInArr(itme,arr){
  for(var i=0; i<arr.length; i++){
    if(arr[i]==itme){
      return true;
    }
  }
  return false; //给不给返回值都可以。  不给返回值默认undefined（都为假）
}

5.事件绑定

//事件绑定
function addEvent(obj,sEv,fn){
    if(obj.addEventListener){
        //兼容ie9+ FF Chrome
        obj.addEventListener(sEv,fn,false);
    }else{
        //兼容IE系
        obj.attachEvent('on'+sEv,fn);
    }
}
//事件解绑
function removeEvent(obj,sEv,fn){
    if(obj.removeEventListener){
        //兼容ie9+ FF Chrome
        obj.removeEventListener(sEv,fn,false);
    }else{
        //兼容IE系
        obj.detachEvent('on'+sEv,fn);
    }
}

6.事件绑定

/*
     * @desc 获取非行间样式
     * @parmas Object
     * @parmas String

     * @return Object
     */
//处理getElementsByClassName不兼容问题的函数
function getByClass(obj,sClass){//obj代指在谁下面获取
  if(obj.getElementsByClassName){//判断是否是高级浏览器
    return obj.getElementsByClassName(sClass);
  }else{
    //*获取所有标签
    var oGet=obj.getElementsByTagName('*');
    
    var arr=[];
    for(var i=0; i<oGet.length; i++){
      //把每个calss切成一个个的字符串
      var aClass=oGet[i].className.split(' ');
      //找是否出现过，
      if(findInArr(sClass,aClass)){
        arr.push(oGet[i]);
      }
    }
    return arr;
  }
}