原生javascript实现计时器
成品图如意下所示:
实现加到等于5的时候停止
搭建HTML结构
1 minutes:<input type="text" value="0"> 2 seconds:<input type="text" value="0">
开始写javascript代码
1 var minutesNode = document.getElementsByTagName('input')[0]; 2 var secondsNode = document.getElementsByTagName('input')[1]; 3 var minutes = 0, //设置两个初始值为0 4 seconds = 0; 5 6 var timer = setInterval(function(){ //开启定时器 7 seconds ++; //seconds每10毫秒加1 8 if(seconds == 60){ //当seconds一直增加到等于60的时候 9 seconds = 0; //seconds清空等于0 10 minutes ++; //然后miutes加上1 11 } 12 secondsNode.value = seconds; //secods == secondsNode里面的value 13 minutesNode.value = minutes; //minutes == minutesNode里面的value 14 if(minutes == 5){ //当minutes一直增加到等于5的时候 15 clearInterval(timer); //清理定时器,停止运行!!! 16 } 17 },10);
谢谢观看,有大佬路过指点指点意见