1.在电脑桌面打开DW软件
2.点击DW然后创建一个新的布局
3.敲出这些代码即可
4.在打开html就可以看到效果了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>利用一次性定时器计数</title>
<style>
label,input{
line-height: 30px;
}
input{
text-indent: 10px;
}
button{
line-height: 30px;
}
</style>
</head>
<body>
<label for="">计数：</label>
<input type="text" id="inputVal">
<button id="start">开始计数</button>
<button id="stop">停止计数</button>
<script>
window.onload = function(){
//获取开始计数按钮
var start = document.getElementById("start");
//获取停止计数按钮
var stop = document.getElementById("stop");
var num = 0,timer;
var bl = false;//判断当前是否在进行计数
start.onclick = function(){
if(bl==true){
return;
}
// alert(123);
startPrint()
bl=true;
}
stop.onclick = function(){
// alert(234);
stopPrint()
bl = false;
}
function startPrint(){
var inputVal = document.getElementById("inputVal");
inputVal.value= num;
num++;
/* 递归 ：程序调用自身的编程技巧称为递归（recurdion）
就是在运行的过程中调用自己 */
timer = setTimeout(startPrint,100);
}
function stopPrint(){
clearTimeout(timer)
}
}
</script>
</body>
</html>
