一、需求分析
一般網頁，我們剛打開的時候，它會5秒之後，顯示一個廣告，5秒鐘之後，廣告自動關閉。
二、技術分析
1.定時器
- setInterval：每隔多少毫秒執行一次函數
- setTimeout：多少毫秒之後執行一次函數
- clearInterval：停止定時器
- clearTimeout
2.顯示廣告： img.style.display = "block"
3.隐藏廣告：img.style.display = "none"
三、步驟分析
1.确定事件：頁面加載完成的事件 onload
2.事件要觸發函數：init()
3.init函數裡面做一件事：
（1）.啟動一個定時器：setTimeout()
（2）.顯示一個廣告
a.再去開啟一個定時器5秒鐘之後，關閉廣告
四、代碼實作
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>定時彈出廣告</title>
<script>
function hideAD(){
var img = document.getElementById("img1");
img.style.display = "none";
}
function showAD(){
//首先要擷取要操作的img
var img = document.getElementById("img1");
//顯示廣告
img.style.display = "block";
//開啟定時器，關閉廣告
setTimeout("hideAD()",5000);
}
function init(){
setTimeout("showAD()",3000);
}
</script>
</head>
<body onload="init()">
<img src="../img/3.gif" width="50%" style="display:none;" id="img1"/>
</body>
</html>
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)