工作中一些常用的js函数总结

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了工作中一些常用的js函数总结相关的知识,希望对你有一定的参考价值。

1.随机数

function rnd(n,m){

  return parseInt(Math.random()*(m-n)+n);

}

2.获取非行间样式

function getStyle(obj,name){

  return obj.currentStyle?obj.currentStyle[name]:getComputedStyle(obj,false)[name];

}

3.通过class获取元素

function getByClass(obj,sClass){

  var aEle = obj.getElementsByTagName(‘*‘);

  var result = [];

  for(var i=0,len=aEle.length; i<len; i++){

    var arr = aEle[i].className.split(‘ ‘);

    if(findInArr(arr,sClass)){

      result.push(aEle[i]);

    }

  }

  return result;

}

function findInArr(arr,sClass){

  for(var i=0,len=arr.length; i<len; i++){

    if(arr[i]==sClass){

      return true;

    }

  }

  return false;

}

4.事件绑定

function addEvent(obj,Evt,fn){

  if(obj.addEventListener){

    obj.addEventListener(Evt,fn,false);

  }else{

    obj.attachEvent(‘on‘+Evt,fn);

  }

}

5.addready

function addReady(fn){

  if(document.addEventLitener){

    document.addEventLitener(‘DOMContentLoad‘,fn,false);

  }else{

    document.onreadystatechange = function(){

      if(document.readyState==‘complelte‘){

        fn();

      }

    };

  }

}

5.运动框架

**getStyle 获取样式
**参数 obj:元素 name:样式名
**返回值 样式值
*/
function getStyle(obj,name){
  return obj.currentStyle?obj.currentStyle[name]:getComputedStyle(obj,false)[name];
}

/*
**move 运动框架
**参数 obj 元素
** json 样式{width:200,height:200}
** time 时间(ms)
*/
function move(obj,json,options){
  options=options||{};
  options.time=options.time||700;
  options.type=options.type||‘ease-out‘;
  var dis={};
  var start={};
  for(var name in json){
    if(name==‘opacity‘){
      start[name]=parseFloat(getStyle(obj,name));
    }else{
      start[name]=parseInt(getStyle(obj,name));
    }
    dis[name]=json[name]-start[name];
  }
  var count = Math.round(options.time/30);
  var n = 0;
  clearInterval(obj.timer);
  obj.timer=setInterval(function(){
    n++;
    for(var name in json){
      switch(options.type){
        case ‘linear‘:
          var cur = start[name]+dis[name]*n/count;
          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;
        default:
          var a = 1-n/count;
          var cur = start[name]+dis[name]*(1-a*a*a);
          break;
      }

      if(name==‘opacity‘){
        obj.style.opacity=cur;
        obj.style.filter=‘alpha(opacity:‘+cur*100+‘)‘;
      }else{
        obj.style[name]=cur+‘px‘;
      }
    }
    if(n==count){
      clearInterval(obj.timer);
      options.end&&options.end();
    }
  },30);
}

6.cookie的添加、获取、删除

function addCookie(name,value,iDay){

  if(iDay){

    var oDate = new Date();

    oDate.setDate(oDate.getDate()+iDay);

    document.cookie = name+‘=‘+value+‘;path=/;expires=‘+oDate.toGMTString();

  }else{

    document.cookie = name+‘=‘+value+‘;path=/‘;

  }

}

function getCookie(name){

  var arr = document.cookie.split(‘; ‘);

  for(var i=0; i<arr.length; i++){

    var arr2=arr[i].split(‘=‘);

    if(arr2[0]==name){

      return arr2[1];

    }

  }

  return ‘‘;

}

function removeCookie(name){

  addCookie(name,‘abc‘,-100);

}

7.getPos获取元素当前的位置

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};

}

8.wheel滚轮事件

function wheel(obj,fn){

  function fnWheel(ev){

    var oEvent = ev||event;

    var down = true;

    down = oEvent.wheelDelta?oEvent.wheelDelta<0:oEvent.detail>0;

    fn&&fn(down);

    oEvent.preventDefault && oEvent.preventDefault();

    return false;

  }

  if(window.navigator.userAgent.toLowerCase().indexOf(‘firefox‘)!=-1){

    obj.addEventListener(‘DOMMouseScroll‘,fnwheel,false);

  }else{

    obj.onmousewheel = function(){

      fnwheel();

    };

  }

}

9.ajax

function json2url(json){

  json.r = Math.random();

  var arr  =[];

  for(var name in json){

    arr.push(name+‘=‘+json[name]);

  }

  return arr.join(‘&‘);

}

function ajax(json){

  json = json||{};

  if(!json.url)return;

  json.data = json.data||{};

  json.type = json.type||‘get‘;

  json.timeout = json.timeout||3000;

  json.dataType = json.dataType||‘text‘;

  var timer = null;

  if(window.XMLHttpRequest){

    var oAjax = new XMLHttpRequest();

  }else{

    var oAjax = new ActiveXObject(‘Microsoft.XMLHTTP‘);

  }

  switch(json.type.toLowerCase()){

    case ‘get‘:

      oAjax.open(‘GET‘,json.url+‘?‘+json2url(json.data),true);

      oAjax.send();

      break;

    case ‘post‘:

      oAjax.open(‘POST‘,json.url,true);

      oAjax.setRequestHeader(‘Content-Type‘,‘application/x-www-form-urlencoded‘);

      oAjax.send(json2url(json.data));

      break;

  }

  json.fnLoading && json.fnLoading();

  oAjax.onreadystatechange = function(){

    if(oAjax.readyState==4){

      json.complete && json.complete();

      clearTimeout(timer);

      if(oAjax.status>=200&&oAjax.status<300||oAjax.status==304){

        if(oAjax.dataType.toLowerCase()==‘xml‘){

          json.success && json.success(oAjax.responseXML);

        }else{

          json.success && json.success(oAjax.responseText);

        }

      }else{

        json.error && json.error(oAjax.status,oAjax.statusText);

      }

    }

 

  };

  timer=setTimeout(function(){
    json.complete && json.complete();
    json.error && json.error(‘网络超时‘);
    oAjax.onreadystatechange=null;
  },json.timeout);

}

10.jsonp

function jsonp(json){

  json = json||{};

  if(json.url)return;

  json.data = json.data||{};

  json.cbName = json.cbName||‘cb‘;

  var fnName = ‘jsonp‘+Math.random();

  fnName = fnName.replace(‘.‘,‘‘);

  window[fnName] = function(data){

    json.success && json.success(data);

    oHead.removeChild(oS);

  };

  json.data[json.cbName] = fnName;

  var arr = [];

  for(var name in json.data){

    arr.push(name+‘=‘+json.data[name]);

  }

  var oS = document.createElement(‘script‘);

  oS.src = json.url+‘?‘+arr.join(‘&‘);

  var oHead = document.getElementsByTagName(‘head‘)[0];

  oHead.appendChild(oS);

}

以上是关于工作中一些常用的js函数总结的主要内容,如果未能解决你的问题,请参考以下文章

总结JS 常用函数

js正则及常用方法函数总结

总结JS 常用函数

让你瞬间提高工作效率的常用js函数汇总

js常用函数和常用技巧

js中的常用函数