纯净、安全、绿色的下载网站

首页|软件分类|下载排行|最新软件|IT学院

当前位置:首页IT学院IT技术

js setinterval延迟一秒解决 JavaScript setinterval延迟一秒解决方案

Nanchen_42   2021-09-13 我要评论
想了解JavaScript setinterval延迟一秒解决方案的相关内容吗,Nanchen_42在本文为您仔细讲解js setinterval延迟一秒解决的相关知识和一些Code实例,欢迎阅读和指正,我们先划重点:js,setinterval延迟一秒解决,js,setinterval延迟一秒解决方案,下面大家一起来学习吧。

当使用setinterval时,发现它刚打开页面时会延迟一秒过后在执行。因为setinterval定时器先执行了自己的一秒钟,执行过后在对里面的内容进行操作,这样就会导致不能立即显示出来

举个例子:先创建一个div盒子,然后写script代码

var div = document.querySelector('div');
			var num = 10;
			setInterval(function(){
				if(num==1){
					div.innerHTML = null;
					return fn1;
				}else{
					num--;
					div.innerHTML = '还剩'+num+'秒';
				}
			},1000);

效果如图:

它的会先执行那一秒钟,等一秒钟过了然后再执行里面显示的内容

解决办法:

直接调用

var div = document.querySelector('div');
			var num = 11;
			function fn1(){
				if(num==1){
					div.innerHTML = null;
					return fn1;
				}else{
					num--;
					div.innerHTML = '还剩'+num+'秒';
				}
			}
			setInterval(fn1,1000);
			fn1();


相关文章

猜您喜欢

  • SpringIOC Bean对象 Spring IOC中的Bean对象用法

    想了解Spring IOC中的Bean对象用法的相关内容吗,.SOLO.在本文为您仔细讲解SpringIOC Bean对象的相关知识和一些Code实例,欢迎阅读和指正,我们先划重点:Spring,IOC,Bean对象,下面大家一起来学习吧。..
  • C++异常处理 C++的异常处理一篇带你了解

    想了解C++的异常处理一篇带你了解的相关内容吗,物随心转在本文为您仔细讲解C++异常处理的相关知识和一些Code实例,欢迎阅读和指正,我们先划重点:C++,C++异常处理,下面大家一起来学习吧。..

网友评论

Copyright 2020 www.cosoft.cc 【酷软网】 版权所有 软件发布

声明:所有软件和文章来自软件开发商或者作者 如有异议 请与本站联系 点此查看联系方式