//使用setTimeout递归实现setInterval
setTimeout和setInterval的区别:setInterval的执行机制是每到一
定时间就固定地往队列里面推执行函数,而不会管之前的事件是否执行完,而
一旦执行的某些事件如:比较耗时的DOM操作等事件,而时间间隔又特别短时,
就会导致后面的事件不等前面的执行完就会再次去执行,长时间的执行,积累
就会导致任务过多,卡顿,使用setTimeout的递归写法来模拟setInterval,
可以在一定程度上解决掉这个长时间运行的卡顿问题,因为setTimeout的执行
机制是等待上次的任务执行完才会去再次执行这个,但是这个方法可能也不够完
善,长时间的运行可能会积累很多东西,
var index = 0;
var setTime= null;
var setFun = function () {
clearTimeout(setTime);
setTime = setTimeout(function () {
console.log(index);
index ++;
setFun();
},200)
};
setFun();
//传入秒数返回时分秒
function formatTime(s) {
var hour = parseInt( s/3600 ),minute = parseInt((s % 3600) /60),second = parseInt( s%60 );
return (hour < 10 ? "0" + hour : hour) + ":" + (minute < 10 ? "0" + minute : minute) + ":" + (second < 10 ? "0" + second : second);
}
console.log(formatTime(3666)); // 返回 01:01:06
//传入时间返回时分秒
function time(start,end){ //默认结束时间大于开始时间,传空为当前时间
var startTime, endTime;
endTime = startTime = new Date().getTime();
function formatTime(t) {
var time = t; //start时间格式如果如:2019-08-08 20:08:08这样的格式,在某些机型会报错,
time = time.replace(/-/g, ':').replace(' ', ':');
time = time.split(':'); //转换成[2019,8,8,20,8,8]
return new Date(time[0], (Number(time[1]) - 1), time[2], time[3], time[4], time[5]).getTime();
}
if (start.length > 0)startTime = formatTime(start);
if (end.length > 0) endTime = formatTime(end);
var s = (endTime - startTime) / 1000;
if (s <= 0) return '00:00:00';
var hour = parseInt(s / 3600);
var minute = parseInt((s % 3600) / 60);
var second = parseInt(s % 60);
return (hour < 10 ? "0" + hour : hour) + ":" + (minute < 10 ? "0" + minute : minute) + ":" + (second < 10 ? "0" + second : second);
}
console.log(time('','2019-3-29 12:00:00')); //返回倒计时 10:10:10
//html和DOM的区别
<input type="text" id="input" value='123'>
setInterval(function () {
console.log(document.getElementById('input').getAttribute('value'));
console.log(document.getElementById('input').value);
console.log($('#input').val());
//加入输入456,则打印出来为
//123 //打印的html属性值,不能更改
//123456 //打印的DOM值,可以更改
//123456 //打印的DOM值,可以更改
},2000)
JS零碎知识记录
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...