小弟,初学javascript,现在下载某网站的视频教程,其它有讲到javascript队列、缓存的问题,硬是看了好几遍,还是看不懂,求教,谢谢!以上例举了一部分代码:window.onload=function () {
var div=document.getElementById("one");
function myAnimalte (obj,attrObj,dur,fn,callback) {
var tween;
var callfun;
if(arguments.length==4){
if(fn.length>=4){
tween=fn;
callfun=null;
}else{
tween= Tween.Quad.easeIn
callfun=fn;
}
}else{
tween=fn?fn: Tween.Quad.easeIn;
callfun=callback?callback:null;
}
Queue.queue(obj,"fx",function () {
var start=[]; //开始值数组
var changes=[];//变化量数组
var times=0;
for (var i in attrObj) {
start[i]=css(obj,i);
changes[i]=attrObj[i]-start[i];
}
obj.time=setInterval(function () {
var stops=true;
if(times<dur){
stops=false;
for (var i in attrObj) {
css(obj,i,tween(times,start[i],changes[i],dur))
}
}
times+=60; if(stops){
for (var i in attrObj) {
css(obj,i,attrObj[i]);
}
clearInterval(obj.time);
if(callfun){
callfun()
}
Queue.dequeue(obj,"fx");
}
},60)
})
}
//---------理解不了开始------------------//队列
var Queue={
queue:function (elem,key,val) {
var key=key?key:"fx";
var q=Data.setData(elem,key);
if(!val){
return q||[];
} if(!q){
q=Data.setData(elem,key,[]);
} if(val instanceof Array){
q=Data.setData(elem,key,val);
}else{
q.push(val);
} if(key=="fx"&&q[0]!=""){
this.dequeue(elem,key)
} return q;
},
dequeue:function (elem,key) {
var key=key||"fx";
var queue=Data.setData(elem,key);
var fn=queue.shift();
if(fn==""){
fn=queue.shift();
}
if(fn){
if(key=="fx"){
queue.unshift("")
}
fn.call(elem)
}
}
}
//缓存
var Data={
cache:{},
uuid:0,
expando:+new Date,
setData:function (elem,key,val) {
var id=elem[this.expando];
if(!id){
id=++this.uuid;
elem[this.expando]=id;
}
if(!this.cache[id]){
this.cache[id]={};
} if(val){
this.cache[id][key]=val;
}
return this.cache[id][key];
}
}
//---------理解不了结束------------------ myAnimalte(div,{width:100,height:400,opacity:40},600)
<div style="width:200px;height:200px;background-color:red;position:absolute" id="one"></div>
var div=document.getElementById("one");
function myAnimalte (obj,attrObj,dur,fn,callback) {
var tween;
var callfun;
if(arguments.length==4){
if(fn.length>=4){
tween=fn;
callfun=null;
}else{
tween= Tween.Quad.easeIn
callfun=fn;
}
}else{
tween=fn?fn: Tween.Quad.easeIn;
callfun=callback?callback:null;
}
Queue.queue(obj,"fx",function () {
var start=[]; //开始值数组
var changes=[];//变化量数组
var times=0;
for (var i in attrObj) {
start[i]=css(obj,i);
changes[i]=attrObj[i]-start[i];
}
obj.time=setInterval(function () {
var stops=true;
if(times<dur){
stops=false;
for (var i in attrObj) {
css(obj,i,tween(times,start[i],changes[i],dur))
}
}
times+=60; if(stops){
for (var i in attrObj) {
css(obj,i,attrObj[i]);
}
clearInterval(obj.time);
if(callfun){
callfun()
}
Queue.dequeue(obj,"fx");
}
},60)
})
}
//---------理解不了开始------------------//队列
var Queue={
queue:function (elem,key,val) {
var key=key?key:"fx";
var q=Data.setData(elem,key);
if(!val){
return q||[];
} if(!q){
q=Data.setData(elem,key,[]);
} if(val instanceof Array){
q=Data.setData(elem,key,val);
}else{
q.push(val);
} if(key=="fx"&&q[0]!=""){
this.dequeue(elem,key)
} return q;
},
dequeue:function (elem,key) {
var key=key||"fx";
var queue=Data.setData(elem,key);
var fn=queue.shift();
if(fn==""){
fn=queue.shift();
}
if(fn){
if(key=="fx"){
queue.unshift("")
}
fn.call(elem)
}
}
}
//缓存
var Data={
cache:{},
uuid:0,
expando:+new Date,
setData:function (elem,key,val) {
var id=elem[this.expando];
if(!id){
id=++this.uuid;
elem[this.expando]=id;
}
if(!this.cache[id]){
this.cache[id]={};
} if(val){
this.cache[id][key]=val;
}
return this.cache[id][key];
}
}
//---------理解不了结束------------------ myAnimalte(div,{width:100,height:400,opacity:40},600)
<div style="width:200px;height:200px;background-color:red;position:absolute" id="one"></div>
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货