Javascript 在animateCograt（）函数中显示所用时间

我有一个定时器功能，每次点击按钮后都会复位。将显示相应的所用时间

我已经给出了

animatecograt（）

，它显示了文本

一致性的效果

我试图在按钮上显示相应的时间，就像祝贺文本一样

我如何做到这一点



无标题文件
无标题文件
@字体{
字体系列：“Sigmar One”；
字体风格：普通；
字体大小：400；
src:local（'Sigmar One-Regular'）、local（'SigmarOne-Regular'）、url（https://fonts.gstatic.com/s/SigmarOne/v8/co3DmWZ8kjZuErj9Ta3do6Tpow.ttf）格式（'truetype'）；
}
@导入url（https://fonts.googleapis.com/css？family=Sigmar+One）；
身体{
溢出：隐藏；
}
.bodyblue{
背景：#3da1d1；
颜色：#fff；
}
.祝贺你{
位置：绝对位置；
顶部：140px；
宽度：550px；
高度：100px；
填充：20px 10px；
文本对齐：居中；
保证金：0自动；
左：0；
右：0；
显示：无；
}
h1{
变换原点：50%50%；
字体大小：50px；
字体系列：“Sigmar One”，草书；
光标：指针；
z指数：2；
位置：绝对位置；
排名：0；
文本对齐：居中；
宽度：100%；
}
blob先生{
高度：50px；
宽度：50px；
颜色：#ffcc00；
位置：绝对位置；
最高：45%；
左：45%；
z指数：1；
字体大小：30px；
显示：无；
}
.时间{
利润率最高：50%；
}
var timeleft=1；
var downloadTimer=setInterval（函数（）{
timeleft++；
document.getElementById（“倒计时”）.textContent=timeleft；
如果（时间间隔>=100）
clearInterval（下载计时器）；
}, 1000);
函数timenow（）{
document.getElementById（“timetake”）.textContent=timeleft；
时间间隔=0；
document.getElementById（“倒计时”）.textContent=timeleft；
}
var images=['https://picsum.photos/200/300/?random', 'https://picsum.photos/200/300/?random', 'https://picsum.photos/200/300/?random', 'https://picsum.photos/200/300/?random'];
var指数=0；
var超时；
函数animateCograt（）{
$（'.congreats'）.show（）；
clearTimeout（超时）；
添加蓝体（）；
重置（）；
var numberOfStars=20；
对于（var i=0；i{
$（'.congreats'）.hide（）；
$（'body'）.removeClass（'bodyblue'）；
}, 4000);
}
函数重置（）{
$.each（$（'.blob'），函数（i）{
TweenMax.集（$（此）{
x:0,，
y:0，
不透明度：1
});
});
TweenMax.集合（$（'h1'）{
比例：1，
不透明度：1，
轮换：0
});
}
函数animateText（）{
TweenMax.from（$（'h1'），0.8{
比例：0.4，
不透明度：0，
轮换：15，
ease:Back.easeOut.config（4），
});
}
函数animateBlobs（）{
var xSeed=0.random（350380）；
var ySeed=u0.random（120170）；
$.each（$（'.blob'），函数（i）{
var$blob=$（此）；
变量速度=随机（1,5）；
变量旋转=随机（5100）；
var标度=随机（0.8,1.5）；
var x=u.random（-xSeed，xSeed）；
var y=u.random（-ySeed，ySeed）；
TweenMax.到（$blob，速度{
x:x，
y:y，
ease:Power1.easeOut，
不透明度：0，
旋转：旋转，
比例：比例，
onStartParams:[$blob]，
onStart:function（$element）{
$element.css（'display'，'block'）；
},
onCompleteParams:[$blob]，
onComplete:函数（$element）{
$element.css（'display'，'none'）；
}
});
});
}
时间0

花费的时间0

单击此处查看所用时间
祝贺

删除多个jQuery-您只能有一个jQuery
将Timetake设置为全局变量
修复未关闭的H1中无效的HTML-span
删除span解决了重复ID问题
删除第二个P解决了第二个重复ID问题
移除H1s的绝对位置

var timeleft=1；
window.onload=函数（）{
var downloadTimer=setInterval（函数（）{
timeleft++；
document.getElementById（“倒计时”）.textContent=timeleft；
如果（时间间隔>=100）
clearInterval（下载计时器）；
}, 1000);
}
函数timenow（）{
document.getElementById（“timetake”）.textContent=timeleft；
时间间隔=0；
document.getElementById（“倒计时”）.textContent=timeleft；
}
var images=['https://picsum.photos/200/300/?random', 'https://picsum.photos/200/300/?random', 'https://picsum.photos/200/300/?random', 'https://picsum.photos/200/300/?random'];
var指数=0；
var超时；
函数animateCograt（）{
$（'.congreats'）.show（）；
clearTimeout（超时）；
添加蓝体（）；
重置（）；
var numberOfStars=20；
对于（var i=0；i{
$（'.congreats'）.hide（）；
$（'body'）.removeClass（'bodyblue'）；
}, 4000);
}
函数重置（）{
$.each（$（'.blob'），函数（i）{
TweenMax.集（$（此）{
x:0,，
y:0，
不透明度：1
});
});
TweenMax.集合（$（'h1'）{
比例：1，
不透明度：1，
罗塔