获取图片的元素对象(document.getElementById(“”))
隐藏图片:display:none
定时操作:setInterval(“显示图片的函数”,3000);
清除定时操作:clearInterval(定时器标识);
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
.images {
border: 1px solid red;
margin: auto;
width: 500px;
height: 500px;
}
</style>
<script>
window.onload = init;
function init() {
//2.设置图片显示的定时操作
time = window.setInterval("showAdv()",3000);
}
//3编写显示广告函数
function showAdv() {
//通过设置style属性的display的值来显示广告
document.getElementById("showAdv").style.display="block";
//4清除显示广告的定时操作
window.clearInterval(time);
//5.定时隐藏图片
time2 = window.setInterval("hideAdv()",6000);
}
function hideAdv() {
//6通过设置style属性的display的值来隐藏广告
document.getElementById("showAdv").style.display="none";
//7清除隐藏广告的定时操作
window.clearInterval(time2);
}
</script>
</head>
<body>
<div class="images">
<img src="images/10.jpg" id="showAdv" width="100%" style="display: none;">
</div>
</body>
</html>