工作中一些常用的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函数总结的主要内容,如果未能解决你的问题,请参考以下文章