1：定时器
····
<html>
<head>
<script>
/*
setTimeout 设置过期时间
setTimeout(时间到了之后要执行的行为，什么时间 毫秒 开始执行)
setInterval 设置中断时间
setInterval(时间到了之后要执行的行为 , 间隔多长时间再执行 )
*/
// 两秒之后执行，执行完当前函数，不再重复执行
setTimeout(function(){
console.log("爆炸了");
} , 2000);
// 只是中断，每个一段时间休息一回，然后接着执行
setInterval(function(){
console.log("死了一回");
} , 2000 );
function daojishi(){
let t = new Date();
document.getElementById("showTime").innerHTML = t.toLocaleTimeString();
}
let fafuqushi = setInterval( daojishi , 1000 );
function stop(){
clearInterval(fafuqushi);
}
</script>
</head>
<body>
<div id="showTime">
</div>
<button onclick="stop()">你敢按吗？</button>
</body>
</html>
····
2：一闪一闪亮晶晶
····
html>
<head>
<style>
#container{
width: 400px;
height: 400px;
border: 1px solid yellowgreen;
background-color: black;
position: relative;
}
span{
font-size: 30px;
color: yellow;
position: absolute;
}
</style>
<script>
var timer;
function start_flash(){
timer = setInterval(function(){
document.getElementById("container").innerHTML = "<span> * </span> ";
let x = parseInt( Math.random()*400 + 1 );
let y = parseInt( Math.random()*400 + 1 );
document.getElementById("container").firstElementChild.style.left = x + "px";
document.getElementById("container").firstElementChild.style.top = y + "px";
} , 200 );
}
function stop_flash(){
clearInterval(timer);
}
</script>
</head>
<body>
<div id="container">
</div>
<button id="star_flash" onclick="start_flash()"> 亮晶晶 </button>
<button id="star_flash" onclick="stop_flash()"> 停止亮晶晶 </button>
</body>
</html>
····
3：定时跳转网页
····
<html>
<head>
<style>
#box{
width: 1300px;
height: 100px;
line-height: 100px;
border: 1px solid black;
color: yellowgreen;
font: 29/30px "simsun";
text-align: center;
}
</style>
</head>
<body>
<div id="box">
5 秒之后，跳转到百度
</div>
</body>
<script>
var div = document.getElementById("box");
var num = 5;
var timer = null;
timer = setInterval(() => {
num --;
div.innerHTML = num +"秒之后跳转百度";
if (num == 0) {
clearInterval(timer);
location.href = "http://www.baidu.com";
}
}, 1000 );
</script>
</html>
····
4：弹窗
····
<html>
<head>
<script>
alert("我是弹窗");
window.alert("全写的窗口弹窗");
confirm("消息确认窗口");
let age = prompt("请输入你的年龄");
alert(age);
</script>
</head>
<body>
</body>
</html>
····
