用javascript做的一个十秒倒计时的小实例
2019-06-27
加入收藏
一、先了解一下setInterval，AAAAA是执行函数，BBBBB是执行周期。
二、创建一个盒子，在脚本中取得元素对象。
三、开始用setinterval方法了。
- F12打开控制台，你可以看到，每秒一个log的刷新。
四、创建一个变量t，用来倒计时用。
- 确实可以倒计时了，但它会倒数到负数，无穷尽倒数。
五、加个判断，让它只倒数十秒。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="cddiv"></div>
<script>
var t = 10;
var elcddiv = document.querySelector("#cddiv");
// 取得元素对象
var cd = setInterval("cdfun()",1000);
// 用setInterval方法创建对象，1秒周期循环执行cdfun()函数
function cdfun() {
elcddiv.innerHTML = t;
if (t == 0) {
clearInterval(cd);
// clearInterval是用来结束setInterval的
alert("倒计时结束！")
}
t--;
}
</script>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="cddiv"></div>
<script>
var t = 10;
var elcddiv = document.querySelector("#cddiv");
// 取得元素对象
var cd = setInterval("cdfun()",1000);
// 用setInterval方法创建对象，1秒周期循环执行cdfun()函数
function cdfun() {
elcddiv.innerHTML = t;
if (t == 0) {
clearInterval(cd);
// clearInterval是用来结束setInterval的
alert("倒计时结束！")
}
t--;
}
</script>
</body>
</html>
